博主信息
博文 26
粉丝 1
评论 0
访问量 23175
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
定时器案例
坏人也温柔de陈词滥调
原创
804人浏览过

实例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>定时器</title>
</head>
<body>
<button>登录</button>
<button>取消</button>
<p></p>
<hr>
<button>播放</button>
<button>停止</button>
<hr>
<div style="width: 400px; height: 300px; background-color:lemonchiffon ;">我不是广告</div>
<p id="res"></p>
<script>
    var btn1=document.getElementsByTagName('button').item(0);
    var btn2=document.getElementsByTagName('button').item(1);
    var tips=document.getElementsByTagName('p').item(0);
   
    var timer =null;

    btn1.addEventListener('click',login,false);
     function login() {
         tips.innerText='正中跳转中...';
         timer=setTimeout(function () {
             location.assign('http://www.baibu.com');
         },3000);
         console.log(timer);
     }

     btn2.addEventListener('click',function (ev) {
         clearTimeout(timer);
         tips.innerText=null;
         console.log(timer);
     });
    setInterval(function(){...}num)
    var btn3=document.getElementsByTagName('button').item(2);
    var btn4=document.getElementsByTagName('button').item(3);
    var img=document.images.item(0)
    btn3.addEventListener('click',play,false);
    function play() {
        timer= setInterval(function () {
            var index=Math.ceil(Math.random()*3);
            img.src='images/banner'+index+'.jpg';
            console.log(img.src);
        },1000);
    }
    btn4.addEventListener('click',function (ev) {
        clearInterval(timer);
    },false);
     var div=document.getElementsByTagName('div').item(0);
     var res=document.getElementById('res');
     var num=0;//点击 次数
     var price=0.5;

    //事件模拟
    var click=new Event('click');
    setInterval(function () {
        div .dispatchEvent(click);
        num+=1;
        console.log(num);
        //输出收入情况
        res.innerHTML='广告收入:'+'<span style="color: red">'+(num * price)+'</span>'+'元';

    },2000);


</script>

</body>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例

X8YQI]RSL8AB]`5NLX@H]$J.png4X)}{]WC(C4S14[YTWA08BA.pngX8YQI]RSL8AB]`5NLX@H]$J.png

批改状态:合格

老师批语:写得还行
本博文版权归博主所有,转载请注明地址!如有侵权、违法,请联系admin@php.cn举报处理!
全部评论 文明上网理性发言,请遵守新闻评论服务协议
0条评论
作者最新博文
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • 登录PHP中文网,和优秀的人一起学习!
    全站2000+教程免费学