Heim > Artikel > Web-Frontend > js-Implementierung der Aktualisierungszeit jede Sekunde Tutorial

js-Implementierung der Aktualisierungszeit jede Sekunde Tutorial

小云云Original: 2018-01-22 09:21:263964Durchsuche

Dieser Artikel enthält hauptsächlich ein Beispiel für die Verwendung von js, um die Zeit jede Sekunde zu aktualisieren (einschließlich Jahr, Monat, Tag, Stunde, Minute und Sekunde). Der Herausgeber findet es ziemlich gut, deshalb teile ich es jetzt mit Ihnen und gebe es als Referenz. Folgen wir dem Herausgeber und schauen wir uns das an. Ich hoffe, es kann allen helfen.

Prinzip: Verwenden Sie einen Timer, nämlich setInterval(fn,i), um fn alle i Sekunden auszuführen.

Der spezifische Code ist unten angegeben

1. Der Code lautet wie folgt:

<span style="font-size:14px;"><!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<title>用js实现每隔一秒刷新时间(含年月日时分秒)</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>
	<p id="time"></p>
	<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());  //获取时
		 var minite=checkTime(time.getMinutes()); //获取分
		 var second=checkTime(time.getSeconds()); //获取秒
		 /****当时、分、秒、小于10时，则添加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) 定时器，每隔i秒执行fn
</script>
</body>
</html></span><span style="font-size:32px;">
</span>

2. Rendering:

Verwandte Empfehlungen:

PHP+Ajax zur Implementierung der automatischen Seitenaktualisierungszeit_PHP-Tutorial

JS-Beispiel für den Vergleich nur der Zeitgröße

Reines JavaScript zur Implementierung des Echtzeit-Feedback-System-Timecodes

Das obige ist der detaillierte Inhalt vonjs-Implementierung der Aktualisierungszeit jede Sekunde Tutorial. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

php JavaScript ajax JS

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：Detaillierte Erläuterung der EventBus-Implementierung der Geschwisterkomponentenkommunikation in vue2.0sNächster Artikel：Detaillierte Erläuterung der EventBus-Implementierung der Geschwisterkomponentenkommunikation in vue2.0s

In Verbindung stehende Artikel

Mehr sehen