当前位置:编程学习 > JS >>

javascript四种动态在网页中显示时间日期代码

网页特效四种动态在网页中显示时间日期代码
在网页中显示日期时间是比较常用到的,下面我收藏了四种显示方法希望对大有所帮助。

取到各个部分后作字符串连接

代码示例:

<script>

document.write("<span id=time></span>") //输出显示时间日期的容器

setInterval(function(){

with(new Date)

time.innerText=getYear()+"年"+(getMonth()+1)+"月"+getDate()+"日 星期"+"日一二三四五六".charAt(getDay())+" "+getHours()+":"+getMinutes()+":"+getSeconds()

//设置 id 为 time 的对象内的文本为当前日期时间

},1000)       //每1000毫秒(即1秒) 执行一次本段代码

</script>

方法二:直接用 Date 对象的 toLocaleString 方法转化。

代码示例:

<script>

document.write("<span id=time></span>") //输出显示时间日期的容器

//每1000毫秒(即1秒) 执行一次本段代码

setInterval("time.innerText=new Date().toLocaleString()",1000) 

</script>

试一试:读者可以试着用 Date 对象的 getDay 方法加上显示星期的功能。

特别说明

本例主要是在上一例的基本上增加一个 setInterval 定时器,每秒更新显示时间和日期的。

相关问题

如何获取指定日期的星期

在声明 Date 对象时加上日期参数,例如要取得2000年10月1日的星期:

new Date(2000,9,1).getDay()

方法三
<SCRIPT language=JavaScript>
   var enabled = 0;   today = new Date();
   var day;   var date;
   if(today.getDay()==0)     day = "星期日"
   if(today.getDay()==1)     day = "星期一"
   if(today.getDay()==2)     day = "星期二"
   if(today.getDay()==3)     day = "星期三"
   if(today.getDay()==4)     day = "星期四"
   if(today.getDay()==5)     day = "星期五"
   if(today.getDay()==6)     day = "星期六"
   document.fgColor = " cadet";
   date1 = "<font size=2 face=宋体 color=black>" + (today.getYear()) + "年" + (today.getMonth() + 1 ) + "月" + today.getDate() + "日 " + "</font>";
   date2 = "<font size=2 face=宋体 color=black>" + day + "</font>";
   document.write("<right>" + date1.fontsize(2) + date2.fontsize(2) + "</right>");
   </SCRIPT>
                                        </td>
                                        <td>
                                        <class=t_msgfont align=center><SPAN id=liveclock 15px? height: 30px; style?="width:"><FONT color=black size=2>17:47:26</FONT></SPAN>
<SCRIPT language=javascript>
function www_helpor_net()
{
var Digital=new Date()
var hours=Digital.getHours()
var minutes=Digital.getMinutes()
var seconds=Digital.getSeconds()
if(minutes<=9)
minutes="0"+minutes
if(seconds<=9)
seconds="0"+seconds
myclock="<font size=2 color=black>"+hours+":"+minutes+":"+seconds+"</font>"
if(document.layers){document.layers.liveclock.document.write(myclock)
document.layers.liveclock.document.close()
}else if(document.all)
liveclock.innerHTML=myclock
setTimeout("www_helpor_net()",1000)
}
www_helpor_net();
</SCRIPT>


方法四

<html>
 <body>
  <script language="javascript">
   function disptime()
   {
   var now=new Date();
   var hour=now.getHours();
   var minute=now.getMinutes();
   var second=now.getSeconds();
   var day=now.getDay();
   var apm="上午";
    if(hour>12)
     {
      hour=hour-12;
      apm="下午";
     }
     if(minute<10)
     {
      minute="0"+minute;

     }
     if(second<10)
     {
      second="0"+second;
     }
     document.form.text.value=hour+"时"+minute+"分"+second+"秒"+apm;
      setTimeout("disptime()",1000);
    }
   
 
  /* switch(day)
   {
    case 0:
    document.write("星期日");
    break;
    case 1:
    document.write("星期一");
    break;
    case 2:
    document.write("星期二");
    break;
    case 3:
    document.write("星期三");
    break;
    case 4:
    document.write("星期四");
    break;
    case 5:
    document.write("星期五");
    break;
    case 6:
    document.write("星期六");
    break;
   }
   */
  </script>
  <form method="post" name="form">
  时间<input type="text" name="text" value="" onFocus="javascript:disptime()"></input>
  </form
 </body>
</html

补充:网页制作,js教程 
CopyRight © 2012 站长网 编程知识问答 www.zzzyk.com All Rights Reserved
部份技术文章来自网络,