生活随笔
收集整理的這篇文章主要介紹了
js:自动亮起100盏灯
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
1)?? ?使用js在頁面上顯示100盞燈，并標記從1到100的編號
2)?? ?頁面加載后3秒，從編號是1的燈依次自動亮起。
3)?? ?每過0.5秒亮下一盞燈(10分)
4)?? ?所有燈亮起后，彈出確認框，詢問是否要關閉頁面
5)?? ?點確定，頁面自動關閉。點取消，頁面不動。
<!DOCTYPE html>
<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>100盞燈
</title><meta charset="utf-8" />
</head>
<body onload="trunonLight();"><div id="divDengAll"><!--<img src="img/2.jpg.gif" id="deng01"/>--></div><script type="text/javascript">function trunonLight() {//放置100盞燈var divDengAll = document.getElementById("divDengAll");var str = "";for (var i = 0; i < 100; i++) {str += "<img src=\"img/2.jpg.gif\" id=\"deng0" + i + "\"/>";}divDengAll.innerHTML = str;var j = 0;setTimeout(function () {//3秒后執行
setInterval(function () {turnonLight2(j);j++}, 500);}, 3000);}//開燈function turnonLight2(j) {// setTimeout(function () {
document.getElementById("deng0" + j).src = "img/1.jpg.gif";// }, 500);if (j>=99) {if (confirm("全部燈都已亮了，是否關閉本頁面")) {window.close();}}}</script>
</body>
</html> ?
轉載于:https://www.cnblogs.com/25miao/p/10205426.html
總結
以上是生活随笔為你收集整理的js:自动亮起100盏灯的全部內容，希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。
