web前端——实现倒计时，“距离双11天猫狂欢节还剩xxx”

还有一棵西兰花

已于 2024-03-18 10:35:43 修改

阅读量1.1k

点赞数 2

文章标签：前端 javascript

于 2021-11-09 19:59:28 首次发布

本文链接：https://blog.csdn.net/weixin_44831983/article/details/121235514

版权

小白总结一下最近学到的前端知识，实现倒计时~~
两步：
第一步：在body中添加οnlοad=”show()”，onload事件是浏览器解析完页面之后就会自动触发的事件

<body onload=”show()”>
<div id=”time”>此处为替换内容</div>
</body>

第二步：在head中添加js事件

<head>
<script>
		function show(){
				var nowtime=new Date(); //创建时间对象 
				var endtime=new Date("2021/11/11,00:00:00"); //结束时间，Date()根据字符串生成指定格式的时间-->Tue Oct 19 2021 22:00:00 GMT+0800 (China Standard Time)
var countdown=parseInt((endtime.getTime()-nowtime.getTime())/1000);//getTime () 方法可返回距 1970 年 1 月 1 日之间的毫秒数。
				var day=parseInt(countdown/60/60/24);
				var hour=parseInt(countdown/60/60%24);
				var minute=parseInt(countdown/60%60);
				var second=parseInt(countdown%60);
				document.getElementById("time").innerHTML="距离双11天猫狂欢节还剩day"+"天"+hour+"小时"+minute+"分"+second+"秒";  //将id=”time”的盒子内容替换掉
				setTimeout("show()",1000);//setTimeout()方法用于在指定的毫秒数后调用函数或计算表达式，这里为每1秒调用show()
}
</script>
</head>

还有一棵西兰花

关注

2
点赞
踩
3

收藏

觉得还不错? 一键收藏
打赏
0
评论
web前端——实现倒计时，“距离双11天猫狂欢节还剩xxx”

小白总结一下最近学到的前端知识，实现倒计时~~两步：第一步：在body中添加οnlοad=”show()”，onload事件是浏览器解析完页面之后就会自动触发的事件<body onload=”show()”><div id=”time”>此处为替换内容</div></body>第二步：在head中添加js事件<head><script> function show(){ var nowtime=new Da
复制链接

扫一扫