JS 显示当前日期与时间的代码


Posted in Javascript onMarch 24, 2010

JS 显示当前日期

<script language="Javascript"> 
var datelocalweek=new Array("星期日", "星期一", "星期二","星期三","星期四", "星期五","星期六"); 
var datelocalnow=new Date(); 
var datelocalyear=datelocalnow.getFullYear(); 
var datelocalmonth=(datelocalmonth="0"+(datelocalnow.getMonth()+1)).substr(datelocalmonth.length-2,2); 
var datelocalday=(datelocalday="0"+datelocalnow.getDate()).substr(datelocalday.length-2,2); 
var datelocalweekday=datelocalweek[datelocalnow.getDay()]; 
document.write(datelocalyear+"年"+datelocalmonth+"月"+datelocalday+"日"+" "+datelocalweekday); 
</script>

效果如下图:
JS 显示当前日期与时间的代码
相应的JS如下:

//创建一个数组,用于存放每个月的天数 
function montharr(m0, m1, m2, m3, m4, m5, m6, m7, m8, m9, m10, m11) { 
this[0] = m0; 
this[1] = m1; 
this[2] = m2; 
this[3] = m3; 
this[4] = m4; 
this[5] = m5; 
this[6] = m6; 
this[7] = m7; 
this[8] = m8; 
this[9] = m9; 
this[10] = m10; 
this[11] = m11; 
} 
//实现月历 
function calendar() { 
var monthNames = "JanFebMarAprMayJunJulAugSepOctNovDec"; 
var today = new Date(); 
var thisDay; 
var monthDays = new montharr(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31); 
year = today.getYear() +1900; 
thisDay = today.getDate(); 
if (((year % 4 == 0) && (year % 100 != 0)) || (year % 400 == 0)) 
monthDays[1] = 29; 
nDays = monthDays[today.getMonth()]; 
firstDay = today; 
firstDay.setDate(1); 
testMe = firstDay.getDate(); 
if (testMe == 2) 
firstDay.setDate(0); 
startDay = firstDay.getDay(); 
var dayNames = new Array("星期日","星期一","星期二","星期三","星期四","星期五","星期六"); 
var monthNames = new Array("1月","2月","3月","4月","5月","6月","7月","8月","9月","10月","11月","12月"); 
var now = new Date(); 
document.write("<div id='rili' style='position:absolute;width:140px;left:200px;top:50px;'>") 
document.write("<TABLE width='217' BORDER='0' CELLSPACING='0' CELLPADDING='2' BGCOLOR='#0080FF'>") 
document.write("<TR>"); 
document.write(" <TD> "); 
document.write(" <table border='0' cellspacing='1' cellpadding='2' bgcolor='Silver'>"); 
document.write(" <TR><th colspan='7' bgcolor='#C8E3FF'>"); 
document.writeln(" <FONT STYLE='font-size:9pt;Color:#330099'>" + "公元 " + now.getYear() + "年" + monthNames[now.getMonth()] + " " + now.getDate() + "日 " + dayNames[now.getDay()] + "</FONT>"); 
document.writeln(" </TH></TR><TR><TH BGCOLOR='#0080FF'><FONT STYLE='font-size:9pt;Color:White'>日</FONT></TH>"); 
document.writeln(" <th bgcolor='#0080FF'><FONT STYLE='font-size:9pt;Color:White'>一</FONT></TH>"); 
document.writeln(" <TH BGCOLOR='#0080FF'><FONT STYLE='font-size:9pt;Color:White'>二</FONT></TH>"); 
document.writeln(" <TH BGCOLOR='#0080FF'><FONT STYLE='font-size:9pt;Color:White'>三</FONT></TH>"); 
document.writeln(" <TH BGCOLOR='#0080FF'><FONT STYLE='font-size:9pt;Color:White'>四</FONT></TH>"); 
document.writeln(" <TH BGCOLOR='#0080FF'><FONT STYLE='font-size:9pt;Color:White'>五</FONT></TH>"); 
document.writeln(" <TH BGCOLOR='#0080FF'><FONT STYLE='font-size:9pt;Color:White'>六</FONT></TH>"); 
document.writeln(" </TR><TR>"); 
column = 0; 
for (i=0; i<startDay; i++) { 
document.writeln("\n<TD><FONT STYLE='font-size:9pt'> </FONT></TD>"); 
column++; 
} for (i=1; i<=nDays; i++) { 
if (i == thisDay) { 
document.writeln("</TD><TD ALIGN='CENTER' BGCOLOR='#FF8040'><FONT STYLE='font-size:9pt;Color:#ffffff'><B>") 
} 
else { 
document.writeln("</TD><TD BGCOLOR='#FFFFFF' ALIGN='CENTER'><FONT STYLE='font-size:9pt;font-family:Arial;font-weight:bold;Color:#330066'>"); 
} 
document.writeln(i); 
if (i == thisDay) 
document.writeln("</FONT></TD>") 
column++; 
if (column == 7) { 
document.writeln("<TR>"); 
column = 0; 
} 
} 
document.writeln("<TR><TD COLSPAN='7' ALIGN='CENTER' VALIGN='TOP' BGCOLOR='#0080FF'>") 
document.writeln("<FORM NAME='clock' onSubmit='0'><FONT STYLE='font-size:9pt;Color:#ffffff'>") 
document.writeln("现在时间:<INPUT TYPE='Text' NAME='face' ALIGN='TOP'></FONT></FORM></TD></TR></TABLE>") 
document.writeln("</TD></TR></TABLE></div>"); 
} 
var timerID = null; 
var timerRunning = false; 
function stopclock (){ 
if(timerRunning) 
clearTimeout(timerID); 
timerRunning = false; 
} 
//显示当前时间 
function showtime () { 
var now = new Date(); 
var hours = now.getHours(); 
var minutes = now.getMinutes(); 
var seconds = now.getSeconds() 
var timeValue = " " + ((hours >12) ? hours -12 :hours) 
timeValue += ((minutes < 10) ? ":0" : ":") + minutes 
timeValue += ((seconds < 10) ? ":0" : ":") + seconds 
timeValue += (hours >= 12) ? " 下午 " : " 上午 " 
document.clock.face.value = timeValue; 
timerID = setTimeout("showtime()",1000);//设置超时,使时间动态显示 
timerRunning = true; 
} 
function startclock () { 
stopclock(); 
showtime(); 
}

使用页面显示如下:
<html> 
<script language="JavaScript" type="text/javascript" src="time.js"> </script> 
<body bgcolor="#FFFFFF" onLoad="startclock(); timerONE=window.setTimeout" text="#000000"> 
<script language="JavaScript" type="text/javascript"> 
calendar(); 
</script> 
</body> 
</html>

这就OK了!
Javascript 相关文章推荐
js 通用订单代码
Dec 23 Javascript
JavaScript自定义日期格式化函数详细解析
Jan 14 Javascript
JQuery弹出炫丽对话框的同时让背景变灰色
May 22 Javascript
jQuery CSS()方法改变现有的CSS样式
Aug 20 Javascript
jquery自定义右键菜单、全选、不连续选择
Mar 01 Javascript
JavaScript实现打开链接页面的方式汇总
Jun 02 Javascript
如何解决IONIC页面底部被遮住无法向上滚动问题
Sep 06 Javascript
Node.js+ES6+dropload.js实现移动端下拉加载实例
Jun 01 Javascript
详解vue-cli + webpack 多页面实例配置优化方法
Jul 13 Javascript
jQuery选择器之属性筛选选择器用法详解
Sep 19 jQuery
JS实现简单的抽奖转盘效果示例
Feb 16 Javascript
微信小程序实现发送模板消息功能示例【通过openid推送消息给用户】
May 05 Javascript
jQuery EasyUI 开源插件套装 完全替代ExtJS
Mar 24 #Javascript
锋利的jQuery 要点归纳(三) jQuery中的事件和动画(下:动画篇)
Mar 24 #Javascript
锋利的jQuery 要点归纳(三) jQuery中的事件和动画(上:事件篇)
Mar 24 #Javascript
jQuery AJAX 调用WebService实现代码
Mar 24 #Javascript
jquery 仿QQ校友的DIV模拟窗口效果源码
Mar 24 #Javascript
Javascript中Eval函数的使用
Mar 23 #Javascript
JavaScript Eval 函数使用
Mar 23 #Javascript
You might like
php用正则表达式匹配中文实例详解
2013/11/06 PHP
Yii视图CGridView实现操作按钮定义地址示例
2016/07/14 PHP
php获取数据库中数据的实现方法
2017/06/01 PHP
php实现数组中出现次数超过一半的数字的统计方法
2018/10/14 PHP
Yii2.0框架模型添加/修改/删除数据操作示例
2019/07/18 PHP
laravel 修改记住我功能的cookie保存时间的方法
2019/10/14 PHP
Javascript new Date().valueOf()的作用与时间戳由来详解
2013/04/24 Javascript
JavaScript等比例缩放图片控制超出范围的图片
2013/08/06 Javascript
js时间比较示例分享(日期比较)
2014/03/05 Javascript
使用jquery.validate自定义方法实现&quot;手机号码或者固话至少填写一个&quot;的逻辑验证
2014/09/01 Javascript
JS 终止执行的实现方法
2016/11/24 Javascript
数组Array的一些方法(总结)
2017/02/17 Javascript
Angular 4.x 动态创建表单实例
2017/04/25 Javascript
js实现简单数字变动效果
2017/11/06 Javascript
jquery实现点击a链接,跳转之后,该a链接处显示背景色的方法
2018/01/18 jQuery
实时监控input框,实现输入框与下拉框联动的实例
2018/01/23 Javascript
react中fetch之cors跨域请求的实现方法
2018/03/14 Javascript
深入理解JavaScript 中的匿名函数((function() {})();)与变量的作用域
2018/08/28 Javascript
详解React中传入组件的props改变时更新组件的几种实现方法
2018/09/13 Javascript
细述Javascript的加法运算符的具体使用
2019/10/18 Javascript
js键盘事件实现人物的行走
2020/01/17 Javascript
你所不知道的Python奇技淫巧13招【实用】
2016/12/14 Python
Python运行不显示DOS窗口的解决方法
2018/10/22 Python
pybind11在Windows下的使用教程
2019/07/04 Python
python利用openpyxl拆分多个工作表的工作簿的方法
2019/09/27 Python
Python hashlib常见摘要算法详解
2020/01/13 Python
Python OpenCV实现测量图片物体宽度
2020/05/27 Python
详解如何在PyCharm控制台中输出彩色文字和背景
2020/08/17 Python
html5拍照功能实现代码(htm5上传文件)
2013/12/11 HTML / CSS
基于HTML5的WebGL实现json和echarts图表展现在同一个界面
2017/10/26 HTML / CSS
Algenist奥杰尼官网:微藻抗衰老护肤品牌
2017/07/15 全球购物
全球最大的在线旅游公司:Expedia
2017/11/16 全球购物
2014年基层党建工作总结
2014/11/11 职场文书
如何写观后感
2015/06/19 职场文书
求职信:会计求职的写作技巧
2019/04/24 职场文书
浅谈Python类的单继承相关知识
2021/05/12 Python