版权声明:本文为博主原创文章,未经博主允许不得转载。 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>