原生javascript实现自动更新的时间日期
能够动态变化的事物总比静态的更能够吸引人,甚至更有实用效果,比如能够自动变化的时间日期效果就是如此,下面就通过代码实例介绍一下如何实现此效果,代码实例如下:
一、具体代码
<html> <head> <metacharset="gb2312"> <title>毛票票</title> <scripttype="text/javascript"> vart=null; functiontime(){ dt=newDate(); vary=dt.getFullYear(); varh=dt.getHours(); varm=dt.getMinutes(); vars=dt.getSeconds(); document.getElementById("timeShow").innerHTML="当前时间:"+y+"年"+h+"时"+m+"分"+s+"秒"; t=setTimeout(time,1000); } window.onload=function(){time()} </script> </head> <body> <divid="timeShow"></div> </body> </html>
以上代码实现了我们的要求,下面简单介绍一下实现过程。
二、实现原理
time()函数能够获取当前时间日期,然后在函数最后使用定时器函数递归调用time()函数,也就是能够不断执行time()函数,于是也就实现了时间日期自动更新的经过,这里就不多介绍了。
三、相关信息补充
javascript时间函数
javascript提供了Date对象来进行时间和日期的计算。Date对象有多种构造函数:
1、dateObj=newDate()//当前时间
2、dateObj=newDate(milliseconds)//距离起始时间1970年1月1日的毫秒数
3、dateObj=newDate(datestring)//字符串代表的日期与时间。此字符串可以使用Date.parse()转换,比如"Jannuary1,199820:13:15"
4、dateObj=newDate(year,month,day,hours,minutes,seconds,microseconds)//时间数值,可以不用全部写,不写则默认为0
使用时调用对象函数,比如
year=dateObj.getFullYear();//获得年份值
下面是Date对象的函数列表,使用方法如上所示:
1)、获取类函数:
getDate()函数--返回天数(1-31)
getDay()函数--返回星期数(0-6)
getFullYear()函数--返回四位数年份
getHours()函数--返回小时数(0-23)
getMilliseconds()函数--返回毫秒数(0-999)
getMinutes()函数--返回分钟数(0-59)
getMonth()函数--返回月份数(0-11)
getSeconds()函数--返回的秒数(0-59)
getTime()函数--返回时间戳表示法(毫秒表示)
getYear()函数--返回年份(真实年份减去1900)
2)、设置类函数:
(以下函数均返回date对象距1970年1月1日午夜之间的毫秒数)
setDate()函数--设置月份的一天
setFullYear()函数--设置的年份,月份和天
setHours()函数--设置小时,分钟,秒和毫秒
setMilliseconds()函数--设置毫秒数
setMinutes()函数--设置分钟,秒,毫秒
setMonth()函数--设置月份,天
setSeconds()函数--设置月份的一天
setTime()函数--使用毫秒数设置date对象
setYear()函数--设置年份(真实年份减去1900)
3)、转化显示类函数:
toLocalString()函数--返回本地化字符串表示
toLocaleDateString函数--返回日期部分的本地化字符串
toLocaleTimeString函数--返回时间部分的本地化字符串
相对于local输出,还有:
toString()
toDateString()
toTimeString()
区别在于前者是根据不同的机器有不同的当地语言格式,后者是内部表示格式
4)、日期解析类函数
Date.parse()函数--解析一个日期的字符串,并返回该日期距1970年1月1日午夜之间的毫秒数
以上就是关于javascript时间日期的详细内容,希望对大家的学习有所帮助。