web前端javascript笔记——（15）定时器

已于 2024-01-28 20:41:04 修改
阅读量1k 收藏 10
点赞数 16
文章标签： 前端 javascript 笔记
于 2024-01-24 22:32:16 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/JLY19970726/article/details/135830070
版权

定时器简介

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <script>
            window.onload=function(){
             //获取count
             var count=document.getElementById("count");
             //使得count中的内容，自动切换
             /*JS的程序的执行速度是非常非常快的
              如果希望一段程序，可以每隔一段时间执行一次，可以使用定时调用*/
        /*     for(var i=0;i<10;i++){
                 count.innerHTML=i;
             }
             
             */
            /*setInterval()
             定时调用
             可以将一个函数，每隔一段时间执行一次
             参数：
             1.回调函数。该函数会每隔一段时间被调用一次，可以传一个匿名函数
             2.每次调用间隔的时间，单位是毫秒
             
             * 返回值
             * 返回一个Number类型的数据
             * 这个数字用来作为定时器的唯一标识*/
            var num=1;
            //它的作用相当于一个放慢速度的for循环
            var timer=setInterval(function(){
                count.innerHTML=num++;
                if(num==11){
                    //关闭定时器
                    clearInterval(timer);
                }
            },1000);
            //
            //console.log(timer);    //1
            /*clearInterval()可以用来关闭一个定时器
             这个方法需要一个定时器的标识作为参数，这样将关闭标识对应的定时器*/
            
            };
        </script>
    </head>
    <body>
        <h1 id="count">1</h1>
    </body>
</html>

切换图片练习

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			img{
				width:600;
				height:450px;
			}
		</style>
		<script>
			window.onload=function(){
			var btn01=document.getElementById("btn01");
			
			var btn02=document.getElementById("btn02");
			 /*让图片自动切换*/
			var img1=document.getElementById("img1");
			//创建一个变量，用来保存当前图片的路径
		    var index=0;
		    var speed=1000;
		    //创建一个数组来保存图片的路径
		    var imgArr=["img/011b915f101bf8a801206621f7be55.jpg@3000w_1l_0o_100sh.jpg","img/1.jpg","img/2.jpg","img/5.jpg","img/0vfvn55rfey0vfvn55rfey.jpg"];
			
			var timer;
			btn01.onclick=function(){
				/*目前，我们每点击一次按钮，就会开启一个定时器
				 点击多次就会开启多个定时器，这就导致图片的切换速度过快
				 并且我们只能关闭最后一次开启的定时器*/
				
				//在开启定时器之前，需要将当前元素上的其他定时器关闭
			clearInterval(timer);
		    //而不是写成var timer=setInterval;
			timer=setInterval(function(){
				//使索引自增
				index+=1;
				//判断索引是否超过最大索引
				if(index==imgArr.length){
					index=0;
				}
				//index=index%imgArr.length;    //也可以这样写
				img1.src=imgArr[index];
			},speed);
			};
			
			btn02.onclick=function(){
				//点击按钮之后，停止图片的自动切换
				/*clearInterval()可以接收任意参数
				 如果参数是一个有效的定时器，则停止对应的定时器
				 如果参数不是一个有效的标识，则什么也不做*/
				clearInterval(timer);
			};
			};
		</script>
	</head>
	<body>
		<img src="img/011b915f101bf8a801206621f7be55.jpg@3000w_1l_0o_100sh.jpg" id="img1"> 
		<br/>
		<br/>
		<button id="btn01">开始</button>
		<button id="btn02">停止</button>
	</body>
</html>

修改div移动练习

<!DOCTYPE html>

<head>
    <meta charset="UTF-8">
    <title>

    </title>
    <style>
        #box1 {
            width: 100px;
            height: 100px;
            background-color:red;
            position: absolute;
        }
    </style>
    <script type="text/javascript">
        window.onload = function() {
        	//思路，把方向和速度分开用两个东西控制
        	
            /*使div可以根据不同的方向键向不同的方向移动
             按左键，div向左移，   37
             按右键,div向右移        39
             按上键，div向上移，   38
             按下键,div向下移        40*/
             //创建一个变量表示方向
                
            var dir=0;
            //定义一个变量，来表示移动的速度
                var speed=10;
                
                //开启一个定时器，来控制div的移动
                setInterval(function(){
                	switch(dir){
                    case 37:
                    //offsetLeft为原来的值
                        box1.style.left=box1.offsetLeft-speed+"px";  
                        break;
                    case 38:
                        box1.style.top=box1.offsetTop-speed+"px"; 
                        break;
                    case 39:
                        box1.style.left=box1.offsetLeft+speed+"px"; 
                        break;
                    case 40:
                        box1.style.top=box1.offsetTop+speed+"px"; 
                        break;
                }},30);
            document.onkeydown=function(event){
            	//处理兼容性问题
            	
                event=event||window.event;
                //使dir等于按键的值
                dir=event.keyCode;
                //当用户按了Ctrl之后，速度加快
                if(event.ctrlKey){
                    speed=50;  
                }else{
                	speed=10;
                }
                
            };
            //当按键松开时，div不再移动
            document.onkeyup=function(){
            	//设置dir=0;
            	dir=0;
            };
  
        };
    </script>

</head>

<body>
    <div id="box1"></div>
</body>

</html>

延时调用

<!DOCTYPE html>

<head>
    <meta charset="UTF-8">
    <title>

    </title>
    <style>
        #box1 {
            width: 100px;
            height: 100px;
            background-color:red;
            position: absolute;
        }
    </style>
    <script type="text/javascript">
        window.onload = function() {
        var num=1;
        //开启一个定时器
  /*      setInterval(function(){
        	console.log(num++);
        },3000);
   */     
        /*延时调用
        	 延时调用
         	延时调用一个函数不马上执行，而是隔一段时间以后再执行，
         	而且只会执行一次，
         	延时调用和定时调用的区别
         	延时调用只会执行一次，定时调用会执行好多次
         	
         	延时调用和定时调用实际上是可以互相代替的，再开发中可以根据自己的需要去选择
         	* */
        var timer=setTimeout(function(){
        	console.log(num++);
        },3000);
        //使用clearTimeout()来关闭延时调用
        clearTimeout(timer);
        };
    </script>

</head>

<body>
    
</body>

</html>

定时器的调用

<!DOCTYPE html>

<head>
    <meta charset="UTF-8">
    <title>

    </title>
    <style>
        *{
        	margin:0;
        	padding:0;
        }
        #box1{
        	width:100px;
        	height:100px;
        	background-color: red;
        	position:absolute;
        	left:0;  /*在IE浏览器中，如果没有指定值，获取到的可能就是auto*/
        	
        }
        #box2{
        	width:100px;
        	height:100px;
        	background-color: yellow;
        	position:absolute;
        	left:0;  /*在IE浏览器中，如果没有指定值，获取到的可能就是auto*/
        	top:300px;  /*不写top的话两个会盖在一起*/
        }
    </style>
    <script type="text/javascript">
        window.onload = function() {
        	/*
        	 1.提取共同的方法
        	 2.分开设置定时器
        	 3.回调函数
        	 4.设置修改不同样式
        	 * */
        	//获取box1
        	var box1=document.getElementById("box1");
        	var box2=document.getElementById("box2");
        	var btn01=document.getElementById("btn01");
        	var btn02=document.getElementById("btn02");
        	//获取btn03
        	var btn03=document.getElementById("btn03");
        	var btn04=document.getElementById("btn04");
        	btn03.onclick=function(){
        		move(box2,"top",100,10);
        	};
        	//点击按钮以后box1向右移动(left值增大)
        	//定义一个变量，用来保存定时器的标识
        	/*目前我们的定时器的标识由全局变量timer保存
        	 所有的正在执行的定时器都在这个变量中保存*/
        //	var timer;  //如果开一个共同的定时器，一个就会在执行的时候把另外一个定时器关掉，使其不能执行
        	btn01.onclick=function(){
        	   move(box1,"left",800,20);
        	};
        	
        	//点击btn02，向左移动
        	btn02.onclick=function(){
        	    move(box1,"right",200,10);
        	};
        	btn04.onclick=function(){
        	    move(box2,"height",500,10,function(){
        	    	 move(box2,"width",500,10,function(){
        	    		move(box2,"top",100,10,function(){
        	    	
        	    });
        	    });
        	    });
        	};
        	/*定义一个函数，用来获取指定元素的当前的样式
        	 * 参数：
        	 * obj 要获取样式的元素
        	 * name 要获取的样式名
        	*/
        	function getStyle(obj,name){
        		if(window.getComputedStyle){
        			//正常浏览器的方式,具有getComputedStyle()方法
        			return getComputedStyle(obj,null)[name];
        		}else{
        			//IE 8的方式，没有getComputedStyle()方法
        			return obj.currentStyle[name];
        		}
        	};
        	
        	//尝试创建一个可以执行简单动画的函数
        	function move(obj,attr,target,speed,callback){
        		/*参数：
        		 obj  要执行动画的对象
        		 attr 要执行动画的样式,比如left right top right
        		 target  执行的结果目标
        		 speed :移动的速度
        		 正负不由调用者来考虑，在函数内部进行考虑
        		 callback:回调函数，这个函数会在动画执行完毕以后执行*/
        			//关闭上一个定时器，避免定时器叠加，速度过快
        	    clearInterval(obj.timer);	
        	    //判断速度的正负值
        	    /*如果从0向800移动，则speed为正，反之，为负*/
        	    //获取元素目前的位置
        	    var current=parseInt(getStyle(obj,attr));
        	    if(current>target){
        	    	speed=-speed;
        	    }
        	    
        		//开启一个定时器，用来执行动画效果
        		//向执行动画的对象中添加一个timer属性，用来保存它自己的定时器的标识
        	   obj.timer=setInterval(function(){
        			//获取box1的原来的left值
        			var oldValue=parseInt(getStyle(obj,attr));
        			//在旧值的基础上减少
        			var newValue=oldValue+speed;
        			//向左移动
        			if(speed<0&&newValue<target||speed>0&&newValue>target){
        				
        				newValue=target;
        			   
        			}
        			//这行代码写在判断是否<=0的上面,结果会完全不同
        			obj.style[attr]=newValue+"px";//因为attr是变量，所以需要放在中括号里面
        	//错误的写法		obj.style.attr=newValue+"px";
        			//当元素执行到0px的时候，使其停止执行动画
        			if(newValue===target){
        				clearInterval(obj.timer);
        				//动画执行完毕之后，调用回调函数
        				//如果传回调函数了，再执行
        				callback&&callback();
        			}
        		},30);	
        		
        	}
        	
        };
    </script>

</head>

<body>
    <button id="btn01">点击按钮以后box1向右移动</button>
    <button id="btn02">点击按钮以后box1向左移动</button>
    <button id="btn03">点击按钮以后box2移动</button>
    <button id="btn04">测试按钮</button>
    <br/></br>
    <div id="box1"></div>
    <div id="box2"></div>
</body>

</html>

轮播图（自动播放和点击操作）

<!DOCTYPE html>

<head>
    <meta charset="UTF-8">
    <title>

    </title>
    <style>
    	*{
    		/*清除默认格式*/
    		margin:0;
    		padding:0;
    	}
    	#outer{
    	width:420px;
       	height:300px;
       	margin:50px auto;
       	background-color: greenyellow;
       	padding:10px 0;
       	overflow: hidden;
       	/*给子元素开启绝对定位了，就给父元素开启相对定位*/
       	position: relative;
    	}
       img{
       	width:400px;
       	height:300px;
       	
       }
       ul{
       
       /*给父元素设置宽度，才能横过来，否则父容器宽度不够，设置float:left也没办法横过来*/
       /*开启绝对定位*/
      position: absolute;
       }
       li{
       float:left;
      margin:0 10px;
       list-style: none;
      }
      /*设置导航按钮*/
     #navDiv{
     	/*开启绝对定位*/
     	position:absolute;
     	bottom:10px;
     	margin-left:50%;
     	transform: translateX(-50%);
     }
     #navDiv a{
     	width:15px;
     	height:15px;
     	background-color: #FFFFFF;
     	/*设置浮动以后会横着排列，内联样式会变成块样式
     	 设置超链接浮动*/
     	float:left;
     	/*设置左右外边距*/
     	margin:0 10px;
     	/*设置透明度*/
     	opacity:0.5;
     	/*兼容IE8的透明度*/
     	filter:alpha(opacity=50);
     }
     /*设置鼠标移入的样式*/
       #navDiv>a:hover{
       	
       	background-color:black;
       }  
    </style>
    <script type="text/javascript" src="js/tools.js"></script>
    <script type="text/javascript" >
        window.onload = function() {
        	var imgList=document.getElementById("imgList");
        	var imgArr=document.getElementsByTagName("img");
        	imgList.style.width=imgArr.length*420+"px";
        	//获取所有的a
        	var allA=document.getElementsByTagName("a");
        	//默认显示图片的索引
        	var index=0;
        	//设置默认选中的效果
        	//因为一开始是默认显示第一个图片，所以就这样设置第一个<a>
        	allA[index].style.backgroundColor="black";   //需要加双引号
        	/*点击超链接切换到指定的图片
        	 点击第一个超链接，显示第一个图片
        	 点击第二个超链接，显示第二个图片*/
        	//为所有的超链接都绑定单击响应函数
        	for(var i=0;i<allA.length;i++){
        		//为每个超链接都添加一个num属性，来保存它自己的索引
        		allA[i].num=i;
        		allA[i].onclick=function(){
        			//点击的时候关闭自动切换的定时器
        			clearInterval(timer);
        	//    alert(this); //javascript:;
        	//获取点击超链接的索引
     //   	alert(i);//先执行for循环，再执行单击响应函数,所以获取到的i都是5
                    //获取点击超链接的索引，并将其设置为index
                    index=this.num;
                    //切换图片
                    /*
                     第一张   索引 0   left  0
                     第二张   索引 1   left  -420
                     第三张   索引2    left  -420*2*/
             //       imgList.style.left=(-420)*index+"px";
                    //修改正在选中的a
                    setA();
                    //使用move函数来切换图片
                    move(imgList,"left",-420*index,20,function(){
                    	//点击的时候关闭了自动切换图片的功能
                    	//当动画执行完毕之后，开启自动切换
                    	autoChange();
                    });
        		
        	};
        	}
        	//开启自动切换图片
        	autoChange();
        	//创建一个方法用来设置选中的a
        	function setA(){
        		//判断当前索引是否是最后一张图片
        		if(index>=imgArr.length-1){
        			//则将index设置为0
        			index=0;
        			/*此时显示的是最后一张图片，而最后一张图片和第一张是一模一样的
        			 通过CSS将最后一张切换为第一张*/
        			imgList.style.left=0;
        			
        		}
        		for(var i=0;i<allA.length;i++){
        			//去掉内联样式，样式表里的样式就会生效
        			allA[i].style.backgroundColor="";
        		}
        		//将选中的a设置为黑色
        		allA[index].style.backgroundColor="black";
        	};
        	var timer;
        	//创建一个函数，用来开启自动切换图片
        	function autoChange(){
        		//开启一个定时器，用来定时去切换图片
        		timer=setInterval(function(){
        			//使索引自增
        			index++;
        			index%=imgArr.length;
        			//执行动画，切换图片
        			move(imgList,"left",-420*index,20,function(){
        				//修改导航点
        				setA();
        			});
        		},3000);
        	};
        	
        };
    </script>

</head>

<body>
	<!--创建一个外部的div，来作为大的容器-->
	<div id="outer">
		<!--创建一个ul，用来放置图片-->
		<ul id="imgList">
   	<li><img src="img/011b915f101bf8a801206621f7be55.jpg@3000w_1l_0o_100sh.jpg"></li>
    <li><img src="img/0vfvn55rfey0vfvn55rfey.jpg"></li>
    <li><img src="img/1.jpg"</li>
    <li><img src="img/2.jpg"</li>
    <li><img src="img/5.jpg"></li>
    <!--因为第一张和最后一张的图片一样，所以才看不出切换-->
    <li><img src="img/011b915f101bf8a801206621f7be55.jpg@3000w_1l_0o_100sh.jpg"></li>

   </ul>
   <!--创建导航按钮-->
   <div id="navDiv">
   	<a href="javascript:;"></a>
   	<a href="javascript:;"></a>
   	<a href="javascript:;"></a>
   	<a href="javascript:;"></a>
   	<a href="javascript:;"></a>
   </div>
	</div>
   
</body>

</html>

tools.js文件

 	function getStyle(obj,name){
        		if(window.getComputedStyle){
        			//正常浏览器的方式,具有getComputedStyle()方法
        			return getComputedStyle(obj,null)[name];
        		}else{
        			//IE 8的方式，没有getComputedStyle()方法
        			return obj.currentStyle[name];
        		}
        	};
        	
        	//尝试创建一个可以执行简单动画的函数
        	function move(obj,attr,target,speed,callback){
        		/*参数：
        		 obj  要执行动画的对象
        		 attr 要执行动画的样式,比如left right top right
        		 target  执行的结果目标
        		 speed :移动的速度
        		 正负不由调用者来考虑，在函数内部进行考虑
        		 callback:回调函数，这个函数会在动画执行完毕以后执行*/
        			//关闭上一个定时器，避免定时器叠加，速度过快
        	    clearInterval(obj.timer);	
        	    //判断速度的正负值
        	    /*如果从0向800移动，则speed为正，反之，为负*/
        	    //获取元素目前的位置
        	    var current=parseInt(getStyle(obj,attr));
        	    if(current>target){
        	    	speed=-speed;
        	    }
        	    
        		//开启一个定时器，用来执行动画效果
        		//向执行动画的对象中添加一个timer属性，用来保存它自己的定时器的标识
        	   obj.timer=setInterval(function(){
        			//获取box1的原来的left值
        			var oldValue=parseInt(getStyle(obj,attr));
        			//在旧值的基础上减少
        			var newValue=oldValue+speed;
        			//向左移动
        			if(speed<0&&newValue<target||speed>0&&newValue>target){
        				
        				newValue=target;
        			   
        			}
        			//这行代码写在判断是否<=0的上面,结果会完全不同
        			obj.style[attr]=newValue+"px";//因为attr是变量，所以需要放在中括号里面
        	//错误的写法		obj.style.attr=newValue+"px";
        			//当元素执行到0px的时候，使其停止执行动画
        			if(newValue===target){
        				clearInterval(obj.timer);
        				//动画执行完毕之后，调用回调函数
        				//如果传回调函数了，再执行
        				callback&&callback();
        			}
        		},30);	
        		
        	}

Komorebi_9999
关注
  • 16
    点赞
  • 踩
  • 10
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
Spring定时任务（Web项目）
12-24
本案例实现利用Spring技术实现定时任务功能，用于Web项目
《Web前端设计基础——HTML5、CSS3、JavaScript》课后答案整理.pdf
06-10
《Web前端设计基础——HTML5、CSS3、JavaScript》张树明版前十章课后习题答案
前端学习＜四＞JavaScript——46-定时器
最新发布
——心比天高，仗剑走天涯，保持热爱，奔赴向梦想！低调，谦虚，自律，反思，成长，还算是比较正能量的博主，公益免费传播……内心特别想在AI界做出一些可以推进历史进程影响力的东西(兴趣使然，有点小情怀，也有点使命感呀)…
04-24 1009
方式一：匿名函数每间隔一秒，将 数字 加1：num ++;}, 1000);每间隔一秒，将 数字 加1：​num ++;​代码举例：// 3秒之后，再执行这段代码。}, 3000);​​代码举例：（箭头函数写法）// 3秒之后，再执行这段代码。}, 3000);
Web中的定时操作
Struts 2 的专栏
09-19 7813
Web中的定时操作 1 什么是定时操作     有些时候我们想做一些在将来的事件内发生的事情的预订，例如，9月18号自动弹出警告，每周五自动查毒等，这都叫做定时操作。 2 普通的定时操作     在普通的开发环境中，定时操作的处理非常简单，可以使用操作系统自带的task功能来完成。当然最多还是做一个服务，服务中做一个定时器Timer对象，每当Timer被触发的时候做一些相关的操作。 3 We
web前端之定时器的使用
爸爸去哪了2之熊猫三胞胎的博客
02-03 891
web前端之定时器的使用 定时器的简单介绍： 获取系统时间： 定时器的使用1： html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> head> meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> title>定时器title
Web前端-JavaScript--Bom 定时器 location
yanghainan0318的博客
04-12 224
BOM 所有定义在全局作用域中的变量、函数都会变成window对象的属性和方法 都是绑定给了window对象 作为属性跟方法 因为window经常使用 所以系统默认可以让我们省略 window.(点) 调用 所以绑定给window对象的属性跟方法 调用时 可以省略 window.(点) var num=99; function show() { ...
黑马前端-Web APIs 定时器-间歇函数
黑马程序员官方博客
06-22 474
教程：JavaScript核心之Web APIs实用案例 前期更新笔记内容：Web API 基本认知 / 获取DOM元素 / 设置/修改DOM元素内容和元素属性 倒计时效果 黑马前端专栏干货多多，关注再学，好方便~2022年前端学习路线图：课程、源码、笔记，技术栈 另外此线路图实时更新！需要课后资料的友友们，可以直接告诉我。...
Web前端JavaScript面向对象编程
09-27
这个笔记是我在B站根据Mosh的JavaScript面向对象编程教学视频中学习并记录的，里面有我记录的知识点，自己写的代码，还有小部分的截图。大家可以在学习这个内容的时候看一下我的笔记进行参考一下。 视频链接：...
web前端——JavaScript基础
03-06
思维导图式笔记， 笔记来源https://blog.csdn.net/qq_38490457/article/details/109257751
Javascript/Jquery——简单定时器的多种实现方法
10-27
JavaScript 和 jQuery 提供了两种主要的方法来实现定时器：`setInterval` 和 `setTimeout`。在本文中，我们将深入探讨这两种方法以及它们的不同用法，同时还会介绍一个使用 `setTimeout` 的可停止计时器的例子。 ##...
Web前端JavaScript基础学习笔记
07-25
这个学习笔记是我基于B站视频Mosh的JavaScript基础篇学习记录的一些笔记和代码。 内容不多，也就作为一个大家学习的参考。 免费的笔记，如果你喜欢，请和大家分享这个资源，谢谢。 视频链接：...
前端中常用的定时器：setTimeout与setInterval
weixin_46953330的博客
03-15 515
在日常开发过程中，我们会经常性地使用定时器这一功能，而在前端开发中，最常见的定时器则为以下两类。是延时的时间一到，就会去调用这个回调函数，而这个函数只会被调用一次，调用结束该定时器也就结束。是每隔一个延时的时间，就会重新调用这个函数，直到该定时器被清楚或者网页被关闭。在日常开发中，定时器开启调用后一定要记得关闭，不然会消耗内存。
浅谈Web开发中的定时任务
weixin_34189116的博客
09-05 197
曾经做过Windows server下的定时任务的业务，最近又做了一些Linux下使用Crontab做的定时任务的业务，觉得有必要进行一次小结，于是有了如下这篇文章。 Windows Server下 设置定时任务的步骤如下： 比如：你开发了一个Windows可执行程序，并将其编译成demo.exe，然后你需要该任务每到特定的时间都自动进行执行... 步骤1...
编程示例：web页面上的定时器
红孩儿编程大师
06-06 1135
在windows10没有找到定时器这个小工具，因为经常在手机上使用这个小工具 也是很好用的小工具。 于是，在web页面上，实现了这个小工具。
java Web项目 三种定时器的总结
杨杨杨~~的博客
09-10 3440
java web 项目 定时器总结 总结—(三种定时器的部署和使用) 一、 根据spring框架中的spring-task 标签来实现定时器 applicationContext-aop-Tasks.xml配置 5. 对应的代码 ` 二、根据监听器来实现定时器的作用 1. 首先web.xml配置添加一个监听器，如下: 2.写关于定时的java文件 ...
前端两种常用的定时器
weixin_45096939的博客
01-17 4336
定时器：设定一定时间之后做某事，时间单位是毫秒，1秒等于1000毫秒，定时器回调函数的部分可以直接写函数或者函数名的形式；至于setTimeout一次执行之后要不要清除定时器这点我也不知道，感觉清除不清除好像都可以，如果有答案也可以评论告诉我。setInterval定时器会一直进行下去，不会自己关闭，所以我们可以为定时器命名用来关闭定时器。setTimeout定时器执行结束如果不清除会一直存在，可以为它命名方便清除。2.setInterval（）定时器，延时之后如果不清除则无限次间隔执行。
Web前端开发技术——HTML,CSS,JavaScript 答案
05-20
1. HTML（超文本标记语言）是用于创建 Web 页面的标准标记语言，它描述了一个页面的结构和内容。 2. CSS（层叠样式表）是用于控制 Web 页面样式的语言，它可以对 HTML 元素的布局、字体、颜色等进行样式控制。 3. JavaScript 是用于实现 Web 页面交互效果的编程语言，它可以被用于动态地修改 HTML 和 CSS，实现用户与页面的交互。 这三种技术通常一起使用，用于创建 Web 页面，使其具有更好的结构、样式和交互效果。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Komorebi_9999

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值