收藏
批改状态：未批改
老师批语：
作业总结：创建一个函数，在函数体内新建一个变量endTime，并赋值new一个Date('2019,5,1)'的对象，（个人认为这样比课堂代码写的更容易阅读和记忆），然后再新建一个变量命名为data 并赋值 new Data()，以获取当前时间。 新建一个变量rd取值(endTime-data)/1000，为的是删除毫秒数并取整。
新建变量D以获取剩余天数 赋值用rd除以86400的整数 （60秒*60分*24小时=86400 其实就是一天的秒数）
新建变量H以获取剩余小时 赋值用rd取整86400除以3600
新建变量M以获取剩余分钟 赋值用rd取整3600除以60
新建变量S以获取剩余秒 赋值用rd取整360
获取span标签，在标签内部使用.text函数写入所获取到的值
$('span').text(D+'天'+H+'小时'+M+'分钟'+S+'秒')
函数体外部执行函数，然后使用定时函数每个1000毫秒运行一次函数即可
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>time</title>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<style type="text/css">
*{
margin: 0;
padding: 0;
font-size: 14px;
}
.box{
width: 1200px;
height: 300px;
line-height: 300px;
background: #ff6700;
margin: 30px auto;
text-align: center;
}
p,span{
font-size: 50px;
color:#fff;
}
</style>
</head>
<body>
<div class="box">
<p>距离劳动节还剩<span></span></p>
</div>
<script type="text/javascript">
$(function(){
function Time1(){
// 获取剩余时间，我觉得这样比课堂的代码更简单
var endTime = new Date('2019,5,1') ;
// var endTime = Date.parse('2019,4,5') ;
var data = new Date();
// var time_2 = time_1.getYear();
// 获取一下剩余的时间，去除毫秒
var rd = Math.floor((endTime-data)/1000);
console.log(rd);
// 获得天数
var D = Math.floor(rd/86400);
console.log(D);
// 取余获得剩余小时数
var H = Math.floor(rd%86400/3600);
console.log(H);
// 取余获得剩余分钟数
var M = Math.floor(rd%3600/60);
console.log(M);
// 取余获得剩余秒
var S = Math.floor(rd%60);
console.log(S);
$('span').text(D+'天'+H+'小时'+M+'分钟'+S+'秒')
}
Time1();
setInterval(Time1,1000);
})
</script>
</body>
</html>点击 "运行实例" 按钮查看在线实例
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
