快捷導(dǎo)航

用js實(shí)現(xiàn)每隔一秒刷新時(shí)間的實(shí)例(含年月日時(shí)分秒)

更新時(shí)間：2017年10月25日 11:24:51 投稿：jingxian

下面小編就為大家?guī)?lái)一篇用js實(shí)現(xiàn)每隔一秒刷新時(shí)間的實(shí)例(含年月日時(shí)分秒)。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧

原理：使用定時(shí)器,即setInterval(fn,i),每隔i秒執(zhí)行fn。

下面給出具體的代碼

1.代碼如下：

<span style="font-size:14px;"><!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<title>用js實(shí)現(xiàn)每隔一秒刷新時(shí)間(含年月日時(shí)分秒)</title>
<style>
#time{background:#33F;
   color:white;
	 height:30px;
	 line-height:30px;
	 padding:20px;
	 font-size:18px;
	 width:400px;
	 text-align:center;
	 margin:0 auto;
	 margin-top:200px;}
</style>
</head>
<body>
	<div id="time"></div>
	<script type="text/javascript"> 
	 setInterval(function(){
		 var time=new Date();
		 var year=time.getFullYear(); //獲取年份
		 var month=time.getMonth()+1; //獲取月份
		 var day=time.getDate();  //獲取日期
		 var hour=checkTime(time.getHours());  //獲取時(shí)
		 var minite=checkTime(time.getMinutes()); //獲取分
		 var second=checkTime(time.getSeconds()); //獲取秒
		 /****當(dāng)時(shí)、分、秒、小于10時(shí)，則添加0****/
		 function checkTime(i){
			 if(i<10) return "0"+i;
			 return i;
		 }
		 var box=document.getElementById("time");
		 box.innerHTML=year+"年"+month+"月"+day+"日 "+hour+":"+minite+":"+second;		 
		},1000);   //setInterval(fn,i) 定時(shí)器，每隔i秒執(zhí)行fn
</script>
</body>
</html></span><span style="font-size:32px;">
</span>

2.效果圖：

以上這篇用js實(shí)現(xiàn)每隔一秒刷新時(shí)間的實(shí)例(含年月日時(shí)分秒)就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

JS實(shí)現(xiàn)的找零張數(shù)最小問(wèn)題示例
這篇文章主要介紹了JS實(shí)現(xiàn)的找零張數(shù)最小問(wèn)題,涉及javascript數(shù)學(xué)運(yùn)算相關(guān)操作技巧,需要的朋友可以參考下
2017-11-11
JavaScript實(shí)現(xiàn)點(diǎn)擊圖片換背景
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)點(diǎn)擊圖片換背景，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-11-11
js表單元素checked、radio被選中的幾種方法(詳解)
下面小編就為大家?guī)?lái)一篇js表單元素checked、radio被選中的幾種方法(詳解)。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2016-08-08
用正則表達(dá)式動(dòng)態(tài)創(chuàng)建/增加css style script 兼容IE firefox
動(dòng)態(tài)創(chuàng)建/增加css style script 用正則表達(dá)式兼容IE firefox
2009-03-03
自定義javascript驗(yàn)證框架示例【附源碼下載】
這篇文章主要介紹了自定義javascript驗(yàn)證框架,結(jié)合實(shí)例形式分析了javascript正則驗(yàn)證相關(guān)操作技巧,并附帶源碼供讀者下載參考,需要的朋友可以參考下
2019-05-05
js限制文本框只能輸入中文的方法
這篇文章主要介紹了js限制文本框只能輸入中文的方法,涉及javascript正則匹配及鼠標(biāo)事件的相關(guān)技巧,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下
2015-08-08
JavaScript中的字符串操作詳解
這篇文章介紹了JavaScript中的字符串操作，有需要的朋友可以參考一下
2013-11-11
js停止輸出代碼
方便我們控制js的停止往下執(zhí)行
2008-07-07
微信小程序之GET請(qǐng)求的實(shí)例詳解
這篇文章主要介紹了微信小程序之GET請(qǐng)求的實(shí)例詳解的相關(guān)資料,希望通過(guò)本文能幫助到大家，讓大家理解掌握該如何使用get請(qǐng)求,需要的朋友可以參考下
2017-09-09
在layui tab控件中載入外部html頁(yè)面的方法
今天小編就為大家分享一篇在layui tab控件中載入外部html頁(yè)面的方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
2019-09-09