定时器的使用

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

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容