JS复习作业：Date等函数题，倒计时，钟表，自定义毫秒转化为时间【诗书画唱】
案例:通过Date函数写一个得到当前时间的函数，格式为“2222年02月11日 11:09:01 星期3”
var dangQian=new Date();
var year=dangQian. getFullYear();
var month=dangQian. getMonth()+1;
var day=dangQian. getDate();
var zhouji=dangQian. getDay();
var xiaoshi=dangQian . getHours();
var fenzhong=dangQian . getMinutes();
var miao=dangQian. getSeconds();
var divJieMianVar=document . getElementById("divJieMian");
divJieMianVar. innerHTML="当前时间为"+year+"年"+month+"月"+day+"日"+xiaoshi+":"+fenzhong+":"+miao;
得到当前时间，打印当前时间的毫秒数
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script>
window. onload=function(){
var dangQian=new Date();
var year=dangQian. getFullYear();
var month=dangQian. getMonth()+1;
var day=dangQian. getDate();
var zhouji=dangQian. getDay();
var xiaoshi=dangQian . getHours();
var fenzhong=dangQian . getMinutes();
var miao=dangQian. getSeconds();
var divJieMianVar=document . getElementById("divJieMian");
var zongMiaoShuCha=
parseInt(dangQian.getTime()) ;
divJieMianVar. innerHTML="当前时间为"+year+"年"
+month+"月"+day+"日"+xiaoshi+":"+fenzhong+":"+miao+"；当前时间转换毫秒数为"+zongMiaoShuCha+"毫秒";
}
</script>
</head>
<body>
<div id="divJieMian"></div>
</body>
</html>
或
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script>
window. onload=function(){
var dangQian=new Date();
var year=dangQian. getFullYear();
var month=dangQian. getMonth()+1;
var day=dangQian. getDate();
var zhouji=dangQian. getDay();
var xiaoshi=dangQian . getHours();
var fenzhong=dangQian . getMinutes();
var miao=dangQian. getSeconds();
var divJieMianVar=document . getElementById("divJieMian");
var zongMiaoShuCha=
parseInt(dangQian.valueOf()) ;
divJieMianVar. innerHTML="当前时间为"+year+"年"
+month+"月"+day+"日"+xiaoshi+":"+fenzhong+":"+miao
+"；当前时间转换毫秒数为"+zongMiaoShuCha+"毫秒";
}
</script>
</head>
<body>
<div id="divJieMian"></div>
</body>
</html>
声明一个变量10000000，将该毫秒传入到时间中，打印该时间
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script>
window. onload=function(){
var s=10000000
var dangQian=new Date(s);
var year=dangQian. getFullYear();
var month=dangQian. getMonth()+1;
var day=dangQian. getDate();
var zhouji=dangQian. getDay();
var xiaoshi=dangQian . getHours();
var fenzhong=dangQian . getMinutes();
var miao=dangQian. getSeconds();
var divJieMianVar=document . getElementById("divJieMian");
divJieMianVar. innerHTML="当前时间为"+year+"年"
+month+"月"+day+"日"+xiaoshi+":"+fenzhong+":"+miao;
}
</script>
</head>
<body>
<div id="divJieMian"></div>
</body>
</html>
案例:将上个例子改写为一个时钟
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script>
window. onload=function(){
setInterval(shiZhongFunction,1000);}
function shiZhongFunction(){
var dangQian=new Date();
var year=dangQian. getFullYear();
var month=dangQian. getMonth()+1;
var day=dangQian. getDate();
var zhouji=dangQian. getDay();
var xiaoshi=dangQian . getHours();
var fenzhong=dangQian . getMinutes();
var miao=dangQian. getSeconds();
var divJieMianVar=document . getElementById("divJieMian");
divJieMianVar. innerHTML="当前时间为"+year+"年"
+month+"月"+day+"日"+xiaoshi+":"+fenzhong+":"+miao;
}
</script>
</head>
<body>
<div id="divJieMian"></div>
</body>
</html>
案例:写一个倒计时
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script>
var i;
function daoJishiFunction(){
if(i==0){
alert("倒计时结束，"+"倒计时还有"+i+"秒");
zanTing();
}
var div1=document . getElementById("div1");
div1. innerHTML="倒计时还有"+i+"秒";
i--;
}
var jieshou=null;
function start(){
if(jieshou==null){
jieshou=setInterval(daoJishiFunction, 1000);
}}
function zanTing(){
clearInterval(jieshou);
jieshou=null;
}
window . onload=function(){
i=prompt("请输入倒计时的时间");
}
</script>
</head>
<body>
<div id="div1"></div>
<input type= "button" id= "btn1" value="开始倒计时"onclick= "start()" />
<input type= "button" id= "btn2" value="暂 停" onclick="zanTing()" />
</body>
</html>
这里显示为1，但实际上已经为0秒：
