Heim  >  Artikel  >  Web-Frontend  >  js implementiert Countdown- und Zeitobjekte

js implementiert Countdown- und Zeitobjekte

高洛峰
高洛峰Original
2017-01-04 09:45:531364Durchsuche

Der JS-Code zum Implementieren des Countdown-Effekts lautet wie folgt:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>h
<style>
#box {
 width: 100%;
 height: 400px;
 background: black;
 color: #fff;
 font-size:40px;
 line-height:400px;
 text-align:center;
}
</style>
<script>
window.onload = function(){
 var oBox = document.getElementById(&#39;box&#39;);
 var oDate = new Date();//获取当前时间;
 oDate.setFullYear(2016,11,31);//自动进位;
 oDate.setHours(0,0,0,0);
 
 function countDown(){
  //未来时间戳减去现在时间的时间戳;
  var ms = oDate.getTime() - new Date().getTime();
 
  //毫秒转换成秒
  var oSec = parseInt(ms/1000);
 
  //秒转换成天
  var oDay = parseInt(oSec/86400);
 
  //不到一天剩下的秒数;
  oSec%=86400;
 
  //转换成小时
  var oHour = parseInt(oSec/3600);
 
  //不到一小时剩下的秒数;
  oSec%=3600;
 
  //转换成分钟
  var oMin = parseInt(oSec/60);
 
  //不到一分钟剩下的秒数;
  oSec%=60;
 
  oBox.innerHTML = &#39;距离2016年12月31日还有:&#39;+oDay+&#39;天&#39;+oHour+&#39;时&#39;+oMin+&#39;分&#39;+oSec+&#39;秒&#39;;
 } 
 countDown();
 setInterval(countDown,1000);
}
</script>
</head>
 
<body>
<div id="box">距离2016年12月31日还有:xx天xx时xx分xx秒</div>
</body>
</html>

Der Implementierungseffekt ist wie folgt:

js implementiert Countdown- und Zeitobjekte

Zeitstempel: Millisekunden von Januar 1970 bis heute Nummer: oDate.getTime(); //Fragen Sie mich nicht, warum es von Januar 1970 bis heute ist! Geh nach Baidu!
Zeitobjekt:

Zeit abrufen:

var oDate = new Date();
oYear = oDate.getFullYear();
oMon = oDate.getMonth();
oDay = oDate.getDate();
oHou = oDate.getHours();
oMin = oDate.getMinutes();
oSec = oDate.getSeconds();
oWeek = oDate.getDay();

Zeit einstellen:

oDate.setFullYear(年,月,日);
oDate.setMonth(月);
oDate.setDate(日);
oDate.setHours(时,分,秒,毫秒);
时间会自动进位;

Das war’s auch schon, und es gibt sie Es gibt viele Mängel, ich hoffe, dass jeder weitere wertvolle Meinungen abgeben kann! Voneinander lernen! Voneinander lernen!

Weitere Artikel zur js-Implementierung von Countdown- und Zeitobjekten finden Sie auf der chinesischen PHP-Website!


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