js倒计时小实例（多次定时）
更新时间：2016年12月08日 16:01:57 作者：小朋友663
这篇文章主要介绍了js实现可多次定时的倒计时小实例,具有一定的参考价值，感兴趣的小伙伴们可以参考一下
一个简单的js计时函数（多次定时）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
h1{text-align:center;font-size:40px;}
</style>
</head>
<body>
<h1 id="number">
<!-- 倒计时还有 01时01分01秒 -->
</h1>
<script>
//设置倒计时的时间范围
var seconds = 1000;
//手工调用计时函数
timeRun();
//定时调用函数
var timer = setInterval(timeRun, 1000);
//倒计时函数
function timeRun(){
//获取 h1
var h1 = document.getElementById('number');
//判断
if (seconds <= 0) {
h1.innerHTML = "Game Over";
h1.style.fontSize = "120px";
clearInterval(timer);
return;
}
//计算 秒数 里面包含的小时数
var h = Math.floor(seconds / 3600);
//计算剩下的秒数
var s = seconds - h * 3600;
//在从剩下的秒数中 取出 分钟
var m = Math.floor(s / 60);
//计算剩下的秒数
s -= m * 60;
//处理数字 <10的数字前加0
h = (h<10)?'0'+h:h;
m = (m<10)?'0'+m:m;
s = (s<10)?'0'+s:s;
//拼接字符串
var message = "倒计时还有 "+h+'时'+m+'分'+s+'秒';
//把字符串输出到h1中
h1.innerHTML = message;
//秒数减少
seconds --;
}
</script>
</body>
</html>
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。
相关文章
这篇文章主要为大家详细介绍了TypeScript中字符串的常用操作，例如substring、indexOf、slice、replace等，感兴趣的小伙伴可以跟随小编一起学习一下2023-08-08
本篇文章主要介绍了JS判断浏览器类型和详细区分IE各版本浏览器的代码，非常具有实用价值，有兴趣的可以了解一下。2017-03-03
这篇文章主要介绍了JS运动改变单物体透明度的方法,结合实例形式分析了页面元素属性动态修改相关操作技巧,需要的朋友可以参考下2018-01-01
这篇文章主要介绍了简单了解JavaScript中常见的反模式，反模式 是指对反复出现的设计问题的常见的无力而低效的设计模式，俗话说就是重蹈覆辙。 这篇文章描述了 JavaScript 中常见的一些反模式，以及避免它们的办法。,需要的朋友可以参考下2019-06-06
打开某个页面时，弹出提示框“Internet Explorer无法打开Internet 站，经过一番奋战，利用排除法解决了问题，共发现2种情况2014-04-04
element-ui组件中input等的change事件中传递自定义参数
这篇文章主要介绍了element-ui组件中的input等的change事件中传递自定义参数的实例代码，本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值 ,需要的朋友可以参考下2019-05-05
将中文编入数组，调用数组的sort方法，再用到一个localeCompare即可实现中文排序,需要的朋友可以参考下2014-08-08
这篇文章主要介绍了JavaScript中的alert()函数使用技巧详解,本文讲解了普通弹出、带换行的文本、使用制表符、使用变量、使用样式等选择,需要的朋友可以参考下2014-12-12
这篇文章主要介绍了iframe窗口高度自适应的实现方法，有需要的朋友可以参考一下2014-01-01
为了保证网站个人信息的安全，很多网站在注册页面都设置密码强度这项，用javascript如何实现密码强度校验代码呢？下面小编给大家整理了两种方法使用javascript密码强度校验代码，有需要的朋友可以参考下2015-08-08
最新评论