JavaScript electronic clock countdown_javascript skills-JS Tutorial-php.cn

JavaScript electronic clock countdown_javascript skills

WBOY

Release： 2016-05-16 15:20:45

Original

1690 people have browsed it

The example in this article explains the detailed code of JavaScript electronic clock countdown and shares it with you for your reference. The specific content is as follows
JavaScript time class
1. Get time, minutes and seconds:
getHours()
          getMinutes();
           getSeconds();
2. Get the year, month and day:
           getFullYear();
           getMonth() 1;//The month to be obtained requires 1;
           getDate(); //Date
           getDay(); //Get the day of the week, 0--》Sunday

Rendering:

Example:

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>电子时钟</title>
 <style type="text/css">
 *{
 margin: 0;
 padding: 0;
 }
 #wrap{
  width: 200px;
  height: 100px;
  background-color: black;
 }
 #time{
  color: #fff;
  display: block;
  font-size: 24px;
  margin: 0 auto;
  padding-top: 20px;
  /*border: 1px solid red;*/
  text-align: center;
  width: 100px;
 }
 #timer{
  color: green;
  display: block;
  font-size: 18px;
  margin: 0 auto;
  padding-top: 10px;
  /*border: 1px solid red;*/
  text-align: center;
  /*width: 100px;*/
 }
 </style>
</head>
<body>
 <div id="wrap">
  <span id="time"></span>
  <span id="timer"></span>
 </div>
 <script type="text/javascript">
 var time =document.getElementById("time");
 var timer =document.getElementById("timer");

 setInterval(function() {

 var date = new Date();
 var hours = date.getHours();
 var minutes = date.getMinutes();
 var seconds = date.getSeconds(); 
 var years = date.getYear();
 var dates = date.getDate();
 var monts = date.getMonth()+1; 
 var day = date.getDay();
 var parses = date.getMilliseconds()%60;

 switch(day){
  case 0:
  day="日";
  case 1:
  day="一";
  case 2:
  day="二";
  case 3:
  day="三";
  case 4:
  day="四";
  case 5:
  day="五";
  case 6:
  day="六";
 }
 //如果秒数小于十，在秒数面前连接一个0
 if(seconds < 10) {
  seconds = "0" + seconds;
 }
 //如果分钟数小于十，在分钟数面前连接一个0
 if(minutes < 10) {
  minutes = "0" + minutes;
 }
 //如果小时数小于十，在小说数面前连接一个0
 if(hours < 10) {
  hours = "0" + hours;
 }
 if(years<1900) {
  years = years+1900;
 }
 if(dates<10) {
  dates = "0" + dates;
 }
 if(monts<10) {
  monts = "0" + monts;
 }
 if(parses<10) {
  // parses = "0" + parses;
 }

 
 timer.innerHTML = years +"年" +monts+ "月" +dates +"号"+"星期"+day;
  time.innerHTML = hours + ":" + minutes + ":" + seconds + ":" + parses;
 // date.getTime()//返回的是一个从1970年到当前的毫秒数（时间戳）（ms）
 // date.getMonth()//返回的是月份，从0开始算
 // date.getFullYear();
 
 },10)
 </script>
</body>
</html>

Copy after login

The above is the detailed content of this article. I hope it will be helpful to everyone in learning javascript programming.