任务一:时间差计算
任务要求:
我们在网上购物时,经常会看到商家推出一些抢购活动,网页上会显示活动开始时间的倒计时,如“距离活动开始还有39天19时02分11秒”,其中,“39天19时02分11秒”是一个时间差。
任务分析:
时间差计算,案例的实现思路如下。
定义一个函数,用于计算时间差,该函数的参数表示活动开始时间,在函数内获取当前时间,并计算当前时间到活动开始时间还有多长时间,以“x天x时x分x秒”的格式返回计算结果。
任务实现:
<script>
function countDown(time) {
var nowTime = new Date();
var overTime = new Date(time);
var times = (overTime - nowTime) / 1000;
var d = parseInt(times / 60 / 60 / 24); //天数
d = d < 10 ? "0" + d : d;
var h = parseInt(times / 60 / 60 % 24); //小时
h = h < 10 ? "0" + h : h;
var m = parseInt(times / 60 % 60); //分钟
m = m < 10 ? "0" + m : m;
var s = parseInt(times % 60); //秒数
s = s <= 10 ? "0" + s : s;
return d + "天" + h + "时" + m + "分" + s + "秒";
}
console.log('距离活动开始时间为'+countDown("2024-6-18 12:00:00"));
</script>
任务二:输出当前的日期和时间
任务要求:
应用Date对象中的方法获取当前完整的年份、月份、日期、星期、小时数、分钟数和秒数,将当前的日期也时间分别连在一起并输出。
实现效果如图所示:

任务实现:
<h2>输出当前日期和时间</h2>
<script type="text/javascript">
var now = new Date();//创建日期对象
var year = now.getFullYear();//获取当前年份
var month = now.getMonth() + 1;//获取当前月份
var date = now.getDate();//获取当前日期
var day = now.getDay();//获取当前星期
var week = "";//初始化变量
switch (day) {
case 1://如果变量day的值为1
week = "星期一";//为变量赋值
break;//退出switch语句
case 2://如果变量day的值为2
week = "星期二";//为变量赋值
break;//退出switch语句
case 3://如果变量day的值为3
week = "星期三";//为变量赋值
break;//退出switch语句
case 4://如果变量day的值为4
week = "星期四";//为变量赋值
break;//退出switch语句
case 5://如果变量day的值为5
week = "星期五";//为变量赋值
break;//退出switch语句
case 6://如果变量day的值为6
week = "星期六";//为变量赋值
break;//退出switch语句
default://默认值
week = "星期日";//为变量赋值
break;//退出switch语句
}
var hour = now.getHours();//获取当前小时数
var minute = now.getMinutes();//获取当前分钟数
var second = now.getSeconds();//获取当前秒数
//为字体设置样式
document.write("<span style='font-size:24px;'>");
document.write("今天是:" + year + "年" + month + "月" + date + "日 " + week);//输出当前的日期和星期
document.write("<br>现在是:" + hour + ":" + minute + ":" + second);//输出当前的时间
document.write("</span>");//输出</span>结束标记
</script>