Javascript — timer 事件案例

最新推荐文章于 2022-03-28 21:20:51 发布
最新推荐文章于 2022-03-28 21:20:51 发布
阅读量458 收藏
点赞数
分类专栏： JS 文章标签： 笔记
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_42436355/article/details/81489422
版权

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
  <script tpye="text/javascript">
    //var big=true;
    //function bigger(obj){
    //    var cs =parseInt(obj.style.fontSize);
    //    if(cs){
    //        if(cs>=30){
    //            big=false;
    //            obj.innerHTML="点击变小";
    //        }
    //        if(cs<=12){
    //            big=true;
    //            obj.innerHTML="点击变大";
    //        }
    //        if(big){
    //            cs+=2;
    //        }
    //        else{
    //            cs-=2;
    //        }
    //        obj.style.fontSize=cs+"px";

    //    }
    //    else{
    //        obj.style.fontSize="14px";
    //    }
    //}
    var timeId;
    function cd(){
         timeId=setInterval("bigger()",100);     //在3秒钟之后会执行这个函数，setTimeout的意思就是间隔一段时间来执行谋个函数    
                                         //setTimeout只会执行一次  如果需要重复执行需要使用 setInterval
    }
    function sd(){
        clearInterval(timeId);
    }
    function bigger(){
        var node=document.getElementById("txt");    //获取HTML中id为txt的节点
        //node.style.fontSize="200px";
        var size=parseInt(node.style.fontSize);
        if(size){
            size+=10;
        }
        else{
            size="14";
        }
        node.style.fontSize=size+"px";

    }
 
  </script>
 </head>
 <body>
  <div id="txt">蚊子</div>
  <div οnclick="cd()" style="cursor:pointer">长大</div>
  <div οnclick="sd()" style="cursor:pointer">停止</div>
 </body>
</html>

 

总会吃到鸡的
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
[js]timer计时器笔记
紫洋的博客
11-18 1909
定时器JavaScript 提供定时执行代码的功能，叫做定时器（timer），主要由`setTimeout()`和`setInterval()`这两个函数来完成。它们向任务队列添加定时任务。
javascript timer
NCS123456的博客
01-15 246
作为入门者来说，了解JavaScript中timer的工作方式是很重要的。通常它们的表现行为并不是那么地直观，而这是因为它们都处在一个单一线程中。让我们先来看一看三个用来创建以及操作timer的函数。 1.var id = setTimeout(fn, delay);- 初始化一个单一的timer，这个timer将会在一定延时后去调用指定的函数。这个函数（setTimeout）将返回一个...
timer:简单轻量级的 javascript 计时器
07-01
计时器 简单轻量级的 javascript 计时器 开始 在需要的地方包含 timer.min.js。 创建一个定时器实例： timer = new Timer ( < callback> , < instance> ); 调用 timer.start(duration) 函数。 每隔几秒，就会调用 instance.callback，参数中带有一个布尔值，指示计时器是否已结束。 用法 timer.start(duration)启动计时器 'duration' 秒 timer.togglePause()暂停或恢复计时器 timer.stop()停止计时器 timer.remaining()给出剩余秒数 timer.elapsed()给出经过的秒数 版权 来源在 MIT 许可下
JavaScript Timer
修也
08-13 586
class Timer{ constructor(callback,interval=1000,...params) { if(!callback){ throw "Must to input callback function!"; } this.run = callback; this.interval = interval; this.params = pa...
[ Javascript ] JavaScript中的定时器(Timer) 是如何工作的!
sssffdgh的博客
03-29 320
作为入门者来说，了解JavaScript中timer的工作方式是很重要的。通常它们的表现行为并不是那么地直观，而这是因为它们都处在一个单一线程中。让我们先来看一看三个用来创建以及操作timer的函数。var id = setTimeout(fn, delay);- 初始化一个单一的timer，这个timer将会在一定延时后去调用指定的函数。这个函数（setTimeout）将返回一个唯一的ID，我们...
JavaScript简单下拉菜单实例代码
10-23
clearInterval(c.timer); if (d == 1) { // 展开菜单 ... } else { // 收起菜单 ... } } ``` 展开菜单时，首先清除定时器，然后检查下拉内容是否已完全展开。如果未展开，则将其显示出来，计算最大高度，...
pomodoro-timer:用React制成的Pomodoro手表
05-25
该项目必须通过以下用户案例才能成为成功的项目： 用户故事1 ：我可以看到id =“ break-label”的元素包含一个字符串（例如，“ Break Length”）。 用户故事2 ：我可以看到一个id =“ session-label”的元素，...
javasCript脚本大全
03-07
收集所以的脚本案例！是开发者必备的书！ 特效</TITLE> <script language=javaScript> <!-- // var thissize=20 var textfont="隶书" var textcolor= new Array() textcolor[0]="000000" textcolor[1]="000000" ...
JavaScript两种计时器的实例讲解
10-17
在JavaScript编程中，计时器是实现异步操作和动态效果的关键工具。它们允许开发者在特定时间间隔后...希望这篇文章的内容能对你的学习有所帮助，如果你想要深入学习相关知识，可以继续探索更多相关的教程和实践案例。
VUE中setTimeout和setInterval自动销毁案例
10-14
this._timer && clearTimeout(this._timer); } ``` 这种方法依赖于开发者记得为每个定时器设置引用，并在组件销毁前清除。然而，如果忘记清理，定时器将继续运行，这可能导致内存泄漏或其他不可预期的行为。 为了...
JS中的延时与Timer函数
技术让梦想更有力量
04-03 2777
延时 setTimeout(code,millisec):用于设置在指定的毫秒数后调用函数【设定延时】 var timeOutId=setTimeout(function(){ alert('5秒后弹框'); },5000); clearTimeout(timeOutId):用于取消由setTimeout函数设定的延时   周期调用(timer) setInterval(c
JavaScript中定时器
plannothing的博客
08-22 267
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> window.onload = function(){ //获取count var count = document.getElementById("count"); //使c
js定时器
热门推荐
ScumStudy的博客
10-27 2万+
定时器 一、两种定时器 setTimeout() 延迟定时器 setInterval() 循环定时器（‘间隔器’） 定时器中的函数挂载在window对象上，内部的this指向window setTimeout(function(){ console.log(111); },1000) //一秒钟打印出111 setInterval(function(){ console.
JavaScript定时器详解
静心梦工厂
02-17 1657
定时器 来自《JavaScript 标准参考教程（alpha）》，by 阮一峰目录 setTimeout() setInterval() clearTimeout()，clearInterval() 运行机制 setTimeout(f,0) 含义 应用 正常任务与微任务 参考链接 JavaScript提供定时执行代码的功能，叫做定时器（timer），主
JS 中的两种定时器
lishundi的博客
10-20 1376
setInterval(cb, ms)  setInterval(cb, ms) 全局函数在指定的毫秒(ms)数后执行指定函数(cb)。 返回一个代表定时器的句柄值。可以使用 clearInterval() 函数来清除定时器。 setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。 function printHello(){ ...
JS Timer
weixin_30952535的博客
08-21 64
<scriptlanguage="javascript"type="text/javascript"> setInterval("jstimer.innerHTML=DisplayDate();",1000); functionDisplayDate() { vard,x,minus,second,s=""; ...
js定时器的几种写法
(づ｡◕‿‿◕｡)づgigi奋斗在前端和刷题中╮(╯﹏╰)╭
04-17 5921
setTimeout（）设定一个定时器，在指定时间后执行一段代码。let timeoutId = setTimeout(func,delay,param1,param2,……); timeoutId：为此定时器的id，此id可以传入clearTimeout（）来取消这次定时器 func：为指定时间后执行的函数 delay：是延迟的毫秒数。 如果省略的话，默认取值0。 param：向延迟函数传递而外
JS新玩法：使用setTimeout()来模拟周期可变的setInterval()
double_sweet1的博客
03-28 953
问题描述： 使用setTimeout动态的修改setInterval的周期依次为a,a+b,a+2b,a+3b,...,a+nb。并在指定时间后停止这个周期函数。 问题关键点： （1）动态的修改setInterval的周期 （2）在指定时间后停止这个周期函数 问题实现思路： 针对第一个点，动态的修改setInterval的周期，直接在原始的interval上修改是不会生效的，也就是下面这种写法： let count = 0; setInterval(() => { co
使用ScheduledExecutorService代替Timer的案例
最新发布
06-03
好的，以下是一个使用ScheduledExecutorService代替Timer的案例： ```java import java.util.concurrent.Executors; import java.util.concurrent.ScheduledExecutorService; import java.util.concurrent.TimeUnit...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值