HTML+JS获取系统实时时间并显示

原创于 2017-12-20 11:07:16 发布 · 7k 阅读

13 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #实时显示时间 #HTML+JS

本文介绍了一种使用HTML和JavaScript实现网页上实时显示当前时间的方法。通过每隔一秒更新页面上的时间元素，用户可以查看到不断更新的日期与时间信息。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

HTML+JS实时显示时间

div

 
 <
 div 
  id=
 "div_timer"
 ></
 div
 >

  <
  script 
  type=
  "text/javascript"
  >
 

  //获取系统时间
 

  function 
  showTime() {
 

  nowtime = 
  new 
  Date();
 

  year = 
  nowtime.
  getFullYear();
  //年
 

  month = 
  nowtime.
  getMonth() + 
  1;
  //月
 

  day = 
  nowtime.
  getDate();
  //日
 

  hour = 
  nowtime.
  getHours();
  //时
 

  minutes = 
  nowtime.
  getMinutes(); 
  //分
 

  seconds = 
  nowtime.
  getSeconds(); 
  //秒
 

  //文字增加空格
 

  document.
  getElementById(
  "div_timer").
  style = 
  "white-space:pre;";
 

  
  //显示时间 
 

  document.
  getElementById(
  "div_timer").
  innerText = 
  year + 
  "." + 
  p(
  month) + 
   "." + 
  p(
  day) + 
  " " + 
  p(
  hour) + 
  ":" + 
  p(
  minutes) + 
  ":" + 
  p(
  seconds);
 

  }
 

  setInterval(
  "showTime()", 
  1000);
 

  //月日时分秒小于10补0
 

  function 
  p(
  s) {
 

  return 
  s < 
  10 ? 
  '0' + 
   s : 
  s;
 

  }
 

  <
  /
  script
  >
 