js动态时间显示实例二则

发布时间:2019-08-21编辑:脚本学堂
分享二个js动态显示时间的例子,如何用js实现动态时间显示,有需要的朋友参考下。

例1,js动态时间显示代码。
 

复制代码 代码示例:
<html>  
<head>   
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />   
<title>js动态显示当前日期,时间和星期代码</title>   
<script>  
function getDate(){  
var date=new Date();  
var month=date.getMonth()+1;  
var day=date.getDate();  
 
if(month.toString().length == 1){  //或者用if (eval(month) <10) {month="0"+month}  
 
month='0'+month;  
}  
if(day.toString().length == 1){  
day='0'+day;  
}  
return date.getYear()+'/'+month+'/'+day+'  '+date.toLocaleString().substring(date.toLocaleString().length-10)+'  '+'星期'+'日一二三四五六'.charAt(date.getDay());  
}  
</script>  
</head>  
<body>  
当前时间:<div id="time">  
<script>  
document.getElementById('time').innerHTML=getDate();  
setInterval("document.getElementById('time').innerHTML=getDate();",1000);  
</script>   
</div>    
  (脚本学堂 www.jb200.com 编辑整理)
<span id="day1">  
<script>  
document.getElementById('day1').innerHTML=new Date().getYear()+"年"+(new Date().getMonth()+1)+"月"+new Date().getDate()+"日"+' 星期'+'日一二三四五六'.charAt(new Date().getDay());   
</script>   
</span>  
<span id="day2">  
<script>   
document.getElementById('day2').innerHTML=new Date().toLocaleString();   
setInterval("document.getElementById('day2').innerHTML=new Date().toLocaleString();",1000);   
</script>  
</span>   
 
<br>  
<p>  
setInterval() 1秒后会执行,页面载入后会出现1秒空白<br>  
要显示在一行,请使用&lt;span&gt;标签<br>  
如果使用new Date().getHours()方法,下午的时间会返回12以上的值,我将它换为PM时间方式显示  
</P>  
</body>   
</html> 

例2,js动态显示时间
 

复制代码 代码示例:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>js动态显示当前日期,时间和星期代码</title>
当前时间:<div  id="time">
<script>
document.getElementById('time').innerHTML=new Date().toLocaleString()+' 星期'+'日一二三四五六'.charAt(new Date().getDay());
setInterval("document.getElementById('time').innerHTML=new Date().toLocaleString()+' 星期'+'日一二三四五六'.charAt(new Date().getDay());",1000);
</script>
</div>
</body>
</html>

您可能感兴趣的文章: