学习心得:JQ倒计时个人认为是一个死知识点,主要就是调用掌握了,其他的明白是什么意思就够,以后用到直接套用。
代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>倒计时</title>
<link rel="icon" type="image/x-icon" href="static/images/favicon.ico">
<script type="text/javascript" src="static/jquery-3.3.1.min.js"></script>
<style type="text/css">
*{margin: 0;padding: 0;}
.box1{
font-size: 36px;
width: 1300px;
height: 180px;
margin: 100px auto;
background: #82d743;
line-height: 180px;
text-align: center;
color: #fff;
}
.box2{
font-size: 36px;
width: 1300px;
height: 180px;
margin: 100px auto;
background: red;
line-height: 180px;
text-align: center;
color: #fff;
}
</style>
</head>
<body>
<div class="box1"><p>2019年清明节倒计时 :<span></span></p></div>
<div class="box2"><p>2020年春节倒计时 :<b></b></p></div>
<script>
// 2019年清明节倒计时
$(function(){
function Ro(){
var d=Date.parse("Apr 05,2019")
var date=new Date()
var dd=date.getTime()
var rd=Math.floor((d-dd)/1000)
var days=Math.floor(rd/86400)
var hours=Math.floor(rd%86400/3600)
var minus=Math.floor(rd%3600/60)
var secos=Math.floor(rd%60)
$('span').text(days+"天"+hours+"小时"+minus+"分钟"+secos+"秒")
}
setInterval(Ro,1000)
})
// 2020年春节倒计时
$(function(){
function year(){
var d=Date.parse("January 24,2020")
var date=new Date()
var dd=date.getTime()
var rd=Math.floor((d-dd)/1000)
var days=Math.floor(rd/86400)
var hours=Math.floor(rd%86400/3600)
var minus=Math.floor(rd%3600/60)
var secos=Math.floor(rd%60)
$('b').text(days+"天"+hours+"小时"+minus+"分钟"+secos+"秒")
}
setInterval(year,1000)
})
</script>
</body>
</html>