测试把javascript代码放在网页的底部,测试放在底部的js方法能否正常调用

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/czh500/article/details/84891796

测试把javascript代码放在网页的底部,测试放在底部的js方法能否正常调用,看下执行效果

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>测试把javascript代码放在网页的底部,看下执行效果</title>
<link rel="stylesheet" type="text/css" href="body.css">
<script type="text/javascript">
	//这是放在网页<head标签中的js函数
	function testTopJS() {
		alert("我是放在网页<head标签中的js函数");
	}
</script>

</head>

<body>
	<div id="myDiv1" style="height: auto;">
		<h3>测试把javascript代码放在网页的底部,测试放在底部的js方法能否正常调用,看下执行效果</h3>
		<input type="text" value="点击我看效果(我是放在网页<head>标签中的js代码)"
			onclick="testTopJS()"><br> <br> <input
			type="button" value="测试放在网页底部的js方法能否正常调用" onclick="testBottomJS()">
		<br> <br>
	</div>

	<script type="text/javascript">
		var count = 0;
		//定义一个颜色的数组
		var colors = new Array("red", "blue", "#228B22", "#8E388E", "#5B5B5B",
				"#0A0A0A");
		//测试放在底部的js方法能否正常调用
		function testBottomJS() {
			count++;
			var divNode = document.getElementById("myDiv1");
			var h2Node = document.createElement("H2");
			var myText = "说第" + count + "遍,你们去改变世界,我只想认真赚钱!";
			var strongNodeText = '<strong style="color:'
					+ createRandomColor(colors) + ';">' + myText + '</strong>';
			h2Node.innerHTML = strongNodeText;
			divNode.appendChild(h2Node);
		}

		//产生随机颜色
		function createRandomColor(colorArray) {
			//产生随机数
			var randomNumber = Math.round(Math.random()
					* (colorArray.length - 1));
			return colorArray[randomNumber];
		}
	</script>
</body>
</html>

猜你喜欢

转载自blog.csdn.net/czh500/article/details/84891796