<script type="text/javascript">//定时器是BOM的对象的一个方法，可以省略window//setInterval(callback,time):第一个参数必填，第二个可有可无，单位是毫秒//开启定时器var time =setInterval(function(){//书写任意代码
console.log("我是定时器，么么哒");},2000);
console.log(time);//清除定时器clearInterval(time);//定时器是异步语句：如果某一个语句很耗时，就称之为异步语句//异步语句有一个特征：先执行定时器后面的代码
console.log("定时器后面的代码");</script>
运动套路
<script type="text/javascript">//运动套路，定时器+修改元素的left和topvar div = document.querySelector("div");var l =0;var t =0;//开启定时器setInterval(function(){
l+=10;
t +=5;if(l >=300){
l =300;}
t = t >300?300:t;//修改节点left
div.style.left = l +"px";
div.style.top = t +"px";},100);</script>
练习变脸
<!DOCTYPE html><html><head><metacharset="utf-8"><title></title><styletype="text/css">*{margin: 0;padding: 0;}div{/*定位才有left*/position: absolute;width: 187px;height: 156px;background:url(../img/6.jpg);/*背景图片定位*/background-position: 0px -312px;}</style></head><body><div></div></body></html><scripttype="text/javascript">//获取元素var div = document.querySelector("div");//设置变量
step =0;
l =0;
isMove =false;//设置定时器setInterval(function(){if(isMove)return;
step++;
l +=10;if(step >2) step =0;
div.style.backgroundPosition =-step*187+"px -312px";
div.style.left = l +"px";},100);
document.onclick=function(){
isMove =!isMove;}</script>
