动态时钟
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>动态时钟</title>
<style>
#clock{
font-size: 30px;
font-weight: 900;
color: #FFFFFF;
background-color: #930;
border: 8px double #900;
}
</style>
<script>
function disptime(){
var time=new Date();//获得当前时间
var year=time.getFullYear();//获得年
var month=time.getMonth()+1;//获得月,getMonth的范围是0~11，所以要加1
var date=time.getDate();//获得日
var hour=time.getHours();//获得小时
var minute=time.getMinutes();//获得分钟
var second=time.getSeconds();//获得秒
if(minute<10)
minute="0"+minute;
if(second<10)
second="0"+second;
document.getElementById('clock').innerHTML=year+"年"+month+"月"+date+"日"+hour+":"+minute+":"+second;
//document.getElementById()是用于获取网页标签的id，所以首先（）要有id名，然后通过.innerHTML方法就可以获取到对应标签的内的文本内容
var myTime=setTimeout("disptime()",1000);
}
</script>
</head>
<body onLoad="disptime()">
<span id="clock"></span>
</body>
</html>
考试倒计时
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>考试时间倒计时</title>
<style>
#time{
height: 100px;
background: url(img/begin.jpg);
padding: 200px 500px 500px 126px; <!--上、右、下、左边距-->
color: #0000FF;
font-size: 28px;
}
</style>
</head>
<body>
<div id="time"></div>
<script>
var time=document.getElementById('time');
var ks=new Date();//获得当前时间
var msks=ks.getTime();//换成毫秒数
var js=msks+60*60*1000;//结束的时间
function jsover(){
var syfz=Math.floor((js-new Date().getTime())/(1000*60));
var sym=Math.floor((js-new Date().getTime()-syfz*1000*60)/1000);
if(syfz<5) time.style.background="url(img/exam.jpg no-repeat";
if(syfz<2) time.style.background="url(img/exam1.jpg) no-repeat";
if(syfz<0){
time.innerHTML="";
clearInterval(timeID);
}
else
time.innerHTML="离考试结束还剩"+syfz+"分"+sym+"秒";
}
timeID=setInterval("jsover()",1000);
</script>
</body>
</html>
节日倒计时
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>节日倒计时</title>
<style>
#date{
font-size: 22px;
font-weight: bold;
color: darkorchid;
width: 900px;
height: 230px;
padding: 10px;
background:url(img/girl.jpg) no-repeat ;
}
</style>
</head>
<body>
<div id="date"></div>
<script>
var urodz=new Date("2/14/2021");
var s="今天离下一个情人节";
var now=new Date();
var ile=urodz.getTime()-now.getTime();
var dni=Math.floor(ile/(1000*60*60*24));
var datashow=document.getElementById('date');
if(dni>1)
datashow.innerHTML=s+"还有"+dni+"天";
else if(dni==1)
datashow.innerHTML=s+"还有2天啦";
else if(dni==0)
datashow.innerHTML=s+"还有1天";
else
datashow.innerHTML=s+"好像过了哦";
</script>
</body>
</html>
