JS---设置简易红绿灯
Posted Andy&
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JS---设置简易红绿灯相关的知识，希望对你有一定的参考价值。
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> /*设置原始div大小*/ <style> #div1{ width: 100px; height: 100px; } </style> </head> <body onload="changered()"> <!--onload=""是body里的属性，用于调方法--> <div id="div1"></div> </body> <!--setTimeout()表示一次性定时器--> <script> setTimeout(changered,0); /*设置最开始时间间隔为0*/ function changered(){ var div=document.getElementById("div1"); div.style.backgroundColor="red"; setTimeout(changeyellow,7000);/*红灯持续亮7秒*/ } function changeyellow(){ var div=document.getElementById("div1"); div.style.backgroundColor="yellow"; setTimeout(changegreen,3000); } function changegreen(){ var div=document.getElementById("div1"); div.style.backgroundColor="green"; setTimeout(changered,5000); } </script> </html>
以上是关于JS---设置简易红绿灯的主要内容，如果未能解决你的问题，请参考以下文章