介绍
这篇文章给大家分享的是有关如何使用js实现通过开始结束控制的计时器的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。
js有什么特点
1, js属于一种解释性脚本语言;2,在绝大多数浏览器的支持下,js可以在多种平台下运行,拥有着跨平台特性;3,js属于一种弱类型脚本语言,对使用的数据类型未做出严格的要求,能够进行类型转换,简单又容易上手;4,js语言安全性高,只能通过浏览器实现信息浏览或动态交互,从而有效地防止数据的丢失;5,基于对象的脚本语言,js不仅可以创建对象,也能使用现有的对象。
具体内容如下
<强>时间戳强>的使用的可以取消对多次点击事件产生效果的累加,譬如下文,运用时间戳,保证了在多次点击事件后不会对setInterval()中的时间进行叠加。
<强>开始结束>强运用addEventlistener()来控制开始结束,
<强>实时显示强>在你要显示的文本内容放置在setInterval()中,可实现实时显示的效果。
不足setInterval()方法所设置的时间并不能保证一直是1秒的,有误差,但是可通过前后日期()的不同控制在一定范围内才可执行,不过这里暂时没有设置这个,有空再补。
& lt; ! DOCTYPE html> & lt; html  lang=癳n"祝辞 & lt; head> & lt;才能meta charset=癠TF-8"比; & lt;才能meta name=皏iewport",内容=翱矶?设备宽度,初始=1.0,比; & lt;才能meta http-equiv=癤-UA-Compatible",内容=癷e=edge"比; & lt;才能title>简单计时器& lt;/title> & lt;才能style 类型=拔谋?css"比; 输入{才能 边境:,,,,1 px solid 黑色; ,,,text-align:,; ,,,字体大小:20 px; ,,} & lt;才能/style> & lt;/head> & lt; body> & lt;才能input 类型=皌ext", id=皌ext" https://www.yisu.com/zixun/, value=" 0 ">秒
<脚本type=" text/javascript”> var=0; var防守姿势=0; var btn1=. getelementbyid (“btn1”); 这里做一些var=. getelementbyid(“这里”); var文本=. getelementbyid(“文本”); 函数getStyle (elem道具){ 如果(window.getComputedStyle) { 返回窗口。getComputedStyle (elem null)(道具); 其他}{ 返回elem.currentStyle[支持]; } } var计算=1;//设置时间戳 showTime btn1.addEventListener(“点击”) 函数showTime (e) { 如果(count) { 时间=setInterval(函数(){ 防守姿势+ +; 文本。值=防守姿势; }, 1000) 数=0; } } btn2.addEventListener(“点击”,stopTime) 函数stopTime () { clearInterval(时间); 数=1; }> 脚本 身体>