定时器

作者: 蓝色海洋_bd2b | 来源:发表于2019-04-08 19:33 被阅读0次

    定时器
    定时器在javascript中的作用
    1、制作动画
    2、异步操作
    3、函数缓冲与节流
    定时器类型及语法
    /*
    定时器:
    setTimeout 只执行一次的定时器
    clearTimeout 关闭只执行一次的定时器
    setInterval 反复执行的定时器
    clearInterval 关闭反复执行的定时器
    /
    var time1 = setTimeout(myalert,2000);
    var time2 = setInterval(myalert,2000);
    /

    clearTimeout(time1);
    clearInterval(time2);
    */
    function myalert(){
    alert('ok!');
    }
    定时器制作时钟
    <script type="text/javascript">
    window.onload = function(){
    var oDiv = document.getElementById('div1');
    function timego(){
    var now = new Date();
    var year = now.getFullYear();
    var month = now.getMonth()+1;
    var date = now.getDate();
    var week = now.getDay();
    var hour = now.getHours();
    var minute = now.getMinutes();
    var second = now.getSeconds();
    var str = '当前时间是:'+ year + '年'+month+'月'+date+'日 '+toweek(week)+' '+todou(hour)+':'+todou(minute)+':'+todou(second);
    oDiv.innerHTML = str;
    }
    timego();
    setInterval(timego,1000);
    }
    function toweek(n){
    if(n==0)
    {
    return '星期日';
    }
    else if(n==1)
    {
    return '星期一';
    }
    else if(n==2)
    {
    return '星期二';
    }
    else if(n==3)
    {
    return '星期三';
    }
    else if(n==4)
    {
    return '星期四';
    }
    else if(n==5)
    {
    return '星期五';
    }
    else
    {
    return '星期六';
    }
    }

    function todou(n){
    if(n<10)
    {
    return '0'+n;
    }
    else
    {
    return n;
    }
    }

    </script>
    ......
    <div id="div1"></div>
    定时器制作倒计时
    <script type="text/javascript">
    window.onload = function(){
    var oDiv = document.getElementById('div1');
    function timeleft(){
    var now = new Date();
    var future = new Date(2016,8,12,24,0,0);
    var lefts = parseInt((future-now)/1000);
    var day = parseInt(lefts/86400);
    var hour = parseInt(lefts%86400/3600);
    var min = parseInt(lefts%86400%3600/60);
    var sec = lefts%60;
    str = '距离2016年9月12日晚24点还剩下'+day+'天'+hour+'时'+min+'分'+sec+'秒';
    oDiv.innerHTML = str;
    }
    timeleft();
    setInterval(timeleft,1000);
    }
    </script>
    ......
    <div id="div1"></div>

    相关文章

      网友评论

          本文标题:定时器

          本文链接:https://www.haomeiwen.com/subject/czopiqtx.html