教大家编写一段js代码,实现如下闪烁效果.
源代码
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>闪烁</title>
</head>
<body>
<script language="javascript">
var status = 1;
var blinkCircle = null;
function showBlink() {//主方法
alert("点击成功");
blinkCircle = setInterval('run()', 500);//0.5秒闪烁的闪烁循环
window.setTimeout('stop()', 1000 * 8);//8秒后,停止闪烁
};
function run() { //闪烁
if (status == 1) {
test.style.color = "red";
status = 0;
} else {
test.style.color = "orange";
status = 1;
}
}
function stop() {//停止闪烁
test.style.color = "orange";
clearInterval(blinkCircle);
}
</script>
<button onclick="showBlink()">闪烁8秒</button>
<h3 id="test">小星星</h3>
</body>
</html>
下面我来解读一下我的代码,