大家好,今天小编来为大家解答以下的问题，关于html显示当前时间，js在页面显示当前时间这个很多人还不知道，现在让我们一起来看看吧！
本文目录
一、如何用html写代码,使得在网页上显示当前的时间和日期
1.在电脑磁盘空白出右键-新建，点击文档
2.将文档命名为index，用记事本打开
<html xmlns="">
<meta http-equiv="Content-Type" content="text/html"/>
<title>时间的动态显示</title>
4.在html头部写入获取时间的代码，如图
<script language="javascript">
t= setTimeout(time,1000);//开始执行
var weekday=["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];
document.getElementById("timeShow").innerHTML="现在的时间为："+y+"年"+mm+"月"+d+"日"+weekday[day]+"
t= setTimeout(time,1000);//设定定时器，循环执行
在内容部分写入div标签，并附上ID，用来加载时间的载体。如图：
<div id="timeShow" class="6150-cbe2-5118-ce28 time1"></div>
6.在头部写入div的样式如图，并保存
.time1{width:100%; height:50px; background:#FFF000; line-height:50px; text-align:center;}
7.保存后，将文件后缀命名为html。点击查看，勾选文件扩展名
10.可以看到编写的文件，网页显示时间了
二、html页面怎么获取当前时间
myDate.getYear();//获取当前年份(2位)
myDate.getFullYear();//获取完整的年份(4位,1970-????)
myDate.getMonth();//获取当前月份(0-11,0代表1月)
myDate.getDate();//获取当前日(1-31)
myDate.getDay();//获取当前星期X(0-6,0代表星期天)
myDate.getTime();//获取当前时间(从1970.1.1开始的毫秒数)
myDate.getHours();//获取当前小时数(0-23)
myDate.getMinutes();//获取当前分钟数(0-59)
myDate.getSeconds();//获取当前秒数(0-59)
myDate.getMilliseconds();//获取当前毫秒数(0-999)
myDate.toLocaleDateString();//获取当前日期
var mytime=myDate.toLocaleTimeString();//获取当前时间
myDate.toLocaleString();//获取日期与时间
Date.prototype.isLeapYear判断闰年
Date.prototype.Format日期格式化
Date.prototype.DateAdd日期计算
Date.prototype.DateDiff比较日期差
Date.prototype.toString日期转字符串
Date.prototype.toArray日期分割为数组
Date.prototype.DatePart取日期的部分信息
Date.prototype.MaxDayOfDate取日期所在月的更大天数
Date.prototype.WeekNumOfYear判断日期所在年的第几周
//---------------------------------------------------
//---------------------------------------------------
Date.prototype.isLeapYear= function()
return(0==this.getYear()%4&&((this.getYear()%100!=0)||(this.getYear()%400==0)));
//---------------------------------------------------
//格式 YYYY/yyyy/YY/yy表示年份
//---------------------------------------------------
Date.prototype.Format= function(formatStr)
var Week= ['日','一','二','三','四','五','六'];
str=str.replace(/yyyy|YYYY/,this.getFullYear());
str=str.replace(/yy|YY/,(this.getYear()% 100)>9?(this.getYear()% 100).toString():'0'+(this.getYear()% 100));
str=str.replace(/MM/,this.getMonth()>9?this.getMonth().toString():'0'+ this.getMonth());
str=str.replace(/M/g,this.getMonth());
str=str.replace(/w|W/g,Week[this.getDay()]);
str=str.replace(/dd|DD/,this.getDate()>9?this.getDate().toString():'0'+ this.getDate());
str=str.replace(/d|D/g,this.getDate());
str=str.replace(/hh|HH/,this.getHours()>9?this.getHours().toString():'0'+ this.getHours());
str=str.replace(/h|H/g,this.getHours());
str=str.replace(/mm/,this.getMinutes()>9?this.getMinutes().toString():'0'+ this.getMinutes());
str=str.replace(/m/g,this.getMinutes());
str=str.replace(/ss|SS/,this.getSeconds()>9?this.getSeconds().toString():'0'+ this.getSeconds());
str=str.replace(/s|S/g,this.getSeconds());
//+---------------------------------------------------
//|求两个时间的天数差日期格式为 YYYY-MM-dd
//+---------------------------------------------------
function daysBetween(DateOne,DateTwo)
var OneMonth= DateOne.substring(5,DateOne.lastIndexOf('-'));
var OneDay= DateOne.substring(DateOne.length,DateOne.lastIndexOf('-')+1);
var OneYear= DateOne.substring(0,DateOne.indexOf('-'));
var TwoMonth= DateTwo.substring(5,DateTwo.lastIndexOf('-'));
var TwoDay= DateTwo.substring(DateTwo.length,DateTwo.lastIndexOf('-')+1);
var TwoYear= DateTwo.substring(0,DateTwo.indexOf('-'));
var cha=((Date.parse(OneMonth+'/'+OneDay+'/'+OneYear)- Date.parse(TwoMonth+'/'+TwoDay+'/'+TwoYear))/86400000);
//+---------------------------------------------------
//+---------------------------------------------------
Date.prototype.DateAdd= function(strInterval, Number){
case's':return new Date(Date.parse(dtTmp)+(1000* Number));
case'n':return new Date(Date.parse(dtTmp)+(60000* Number));
case'h':return new Date(Date.parse(dtTmp)+(3600000* Number));
case'd':return new Date(Date.parse(dtTmp)+(86400000* Number));
case'w':return new Date(Date.parse(dtTmp)+((86400000* 7)* Number));
case'q':return new Date(dtTmp.getFullYear(),(dtTmp.getMonth())+
Number*3, dtTmp.getDate(), dtTmp.getHours(), dtTmp.getMinutes(),
case'm':return new Date(dtTmp.getFullYear(),(dtTmp.getMonth())+
Number, dtTmp.getDate(), dtTmp.getHours(), dtTmp.getMinutes(),
case'y':return new Date((dtTmp.getFullYear()+ Number),
dtTmp.getMonth(), dtTmp.getDate(), dtTmp.getHours(), dtTmp.getMinutes(),
//+---------------------------------------------------
//|比较日期差 dtEnd格式为日期型或者有效日期格式字符串
//+---------------------------------------------------
Date.prototype.DateDiff= function(strInterval, dtEnd){
if(typeof dtEnd=='string')//如果是字符串转换为日期型
case's':return parseInt((dtEnd- dtStart)/ 1000);
case'n':return parseInt((dtEnd- dtStart)/ 60000);
case'h':return parseInt((dtEnd- dtStart)/ 3600000);
case'd':return parseInt((dtEnd- dtStart)/ 86400000);
case'w':return parseInt((dtEnd- dtStart)/(86400000* 7));
case'm':return(dtEnd.getMonth()+1)+((dtEnd.getFullYear()-dtStart.getFullYear())*12)-(dtStart.getMonth()+1);
case'y':return dtEnd.getFullYear()- dtStart.getFullYear();
//+---------------------------------------------------
//|日期输出字符串，重载了系统的toString ***
//+---------------------------------------------------
Date.prototype.toString= function(showWeek)
var str= myDate.toLocaleDateString();
var Week= ['日','一','二','三','四','五','六'];
str+='星期'+ Week[myDate.getDay()];
//+---------------------------------------------------
//|格式为：YYYY-MM-DD或YYYY/MM/DD
//+---------------------------------------------------
var sDate=DateStr.replace(/(^\s+|\s+$)/g,'');//去两边空格;
if(sDate=='') return true;
//如果格式满足YYYY-(/)MM-(/)DD或YYYY-(/)M-(/)DD或YYYY-(/)M-(/)D或YYYY-(/)MM-(/)D就替换为''
//数据库中，合法日期可以是:YYYY-MM/DD(2003-3/21),数据库会自动转换为YYYY-MM-DD格式
var s= sDate.replace(/[\d]{ 4,4}[\-/]{ 1}[\d]{ 1,2}[\-/]{ 1}[\d]{ 1,2}/g,'');
if(s=='')//说明格式满足YYYY-MM-DD或YYYY-M-DD或YYYY-M-D或YYYY-MM-D
var t=new Date(sDate.replace(/\-/g,'/'));
if(ar[0]!= t.getYear()|| ar[1]!= t.getMonth()+1|| ar[2]!= t.getDate())
//alert('错误的日期格式！格式为：YYYY-MM-DD或YYYY/MM/DD。注意闰年。');
//alert('错误的日期格式！格式为：YYYY-MM-DD或YYYY/MM/DD。注意闰年。');
//+---------------------------------------------------
//|格式为：YYYY-MM-DD HH:MM:SS
//+---------------------------------------------------
var reg=/^(\d+)-(\d{ 1,2})-(\d{ 1,2})(\d{ 1,2}):(\d{ 1,2}):(\d{ 1,2})$/;
var d= new Date(r[1],r[2],r[3],r[4],r[5],r[6]);
if(d.getFullYear()!=r[1])return false;
if(d.getMonth()!=r[2])return false;
if(d.getDate()!=r[3])return false;
if(d.getHours()!=r[4])return false;
if(d.getMinutes()!=r[5])return false;
if(d.getSeconds()!=r[6])return false;
//+---------------------------------------------------
//+---------------------------------------------------
Date.prototype.toArray= function()
myArray[0]= myDate.getFullYear();
myArray[1]= myDate.getMonth();
myArray[3]= myDate.getHours();
myArray[4]= myDate.getMinutes();
myArray[5]= myDate.getSeconds();
//+---------------------------------------------------
//| y年 m月 d日 w星期 ww周 h时 n分 s秒
//+---------------------------------------------------
Date.prototype.DatePart= function(interval)
var Week= ['日','一','二','三','四','五','六'];
case'y':partStr= myDate.getFullYear();break;
case'm':partStr= myDate.getMonth()+1;break;
case'd':partStr= myDate.getDate();break;
case'w':partStr= Week[myDate.getDay()];break;
case'ww':partStr= myDate.WeekNumOfYear();break;
case'h':partStr= myDate.getHours();break;
case'n':partStr= myDate.getMinutes();break;
case's':partStr= myDate.getSeconds();break;
三、HTML如何显示当前动态时间
如何将当前动态时间显示在网页上，随着时间的变化，秒针自动跳转，显示完整日期和时间。
请看详细，本篇教你如何使用JavaScript将时间打印在HTML网页上。
1、搭建网页利用已搭建的IIS本地服务器，在共享区域新建一个html文件，命名为index.html。如图：（IIS与本地服务器的搭建，请看引用）
2、植入html元素用记事本打开index.html，完善html基本元素。写入一下代码： html xmlns="; head meta http-equiv="Content-Type" content="text/html"/ title时间的动态显示/title/head body/body/html并保存。如图：
3、写入JavaScript时间代码在html头部写入获取时间的代码： script language="javascript" var t= null; t= setTimeout(time,1000);//开始执行 function time(){ clearTimeout(t);//清除定时器 dt= new Date(); var y=dt.getYear()+1900; var mm=dt.getMonth()+1; var d=dt.getDate(); var weekday=["星期日","星期一","星期二","星期三","星期四","星期五","星期六"]; var day=dt.getDay(); var h=dt.getHours(); var m=dt.getMinutes(); var s=dt.getSeconds(); if(h10){h="0"+h;} if(m10){m="0"+m;} if(s10){s="0"+s;} document.getElementById("timeShow").innerHTML="现在的时间为："+y+"年"+mm+"月"+d+"日"+weekday[day]+""+h+":"+m+":"+s+""; t= setTimeout(time,1000);//设定定时器，循环执行}/script如图：
4、写入div标签在内容部分写入div标签，并附上ID，用来加载时间的载体。 div id="timeShow" class="time1"/div如图：
5、写入样式在头部写入div的样式： style.time1{width:100%; height:50px; background:#FFF000; line-height:50px; text-align:center;}/style并保存，如图：
6、加载网页在浏览器输入192.168.1.2，查看编写的网页文件。如图：
如果你还想了解更多这方面的信息，记得收藏关注本站。
