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 相关文章推荐
extJs 下拉框联动实现代码
Apr 09 Javascript
jquery实现ajax提交form表单的方法总结
Mar 03 Javascript
jQuery源码分析之jQuery中的循环技巧详解
Sep 06 Javascript
jQuery定义背景动态切换效果的方法
Mar 23 Javascript
JavaScript控制网页层收起和展开效果的方法
Apr 15 Javascript
WordPress中利用AJAX技术进行评论提交的实现示例
Jan 12 Javascript
js仿百度切换皮肤功能(html+css)
Jul 10 Javascript
你不知道的 javascript【推荐】
Jan 08 Javascript
js实现手机web图片左右滑动效果
Dec 29 Javascript
微信小程序引入VANT组件的方法步骤
Sep 19 Javascript
Vue中key的作用示例代码详解
Jun 10 Javascript
深入分析JavaScript 事件循环(Event Loop)
Jun 19 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
hadoop中一些常用的命令介绍
2013/06/19 PHP
关于php 接口问题(php接口主要也就是运用curl,curl函数)
2013/07/01 PHP
PHP之APC缓存详细介绍 apc模块安装
2014/01/13 PHP
php过滤输入操作之htmlentities与htmlspecialchars用法分析
2017/02/17 PHP
深入理解PHP的远程多会话调试
2017/09/21 PHP
thinkPHP5框架中widget的功能与用法详解
2018/06/11 PHP
用jquery设置按钮的disabled属性的实现代码
2010/11/28 Javascript
JavaScript禁止用户多次提交的两种方法
2016/07/24 Javascript
js学习总结之DOM2兼容处理顺序问题的解决方法
2017/07/27 Javascript
bootstrap日期插件daterangepicker使用详解
2017/10/19 Javascript
JavaScript实现音乐自动切换和轮播
2017/11/05 Javascript
深入理解Angular4订阅(Subscribe)与取消
2017/11/22 Javascript
JQuery样式操作、click事件以及索引值-选项卡应用示例
2019/05/14 jQuery
vue elementui 实现搜索栏公共组件封装的实例代码
2020/01/20 Javascript
Javascript模块化机制实现原理详解
2020/04/02 Javascript
使用 Opentype.js 生成字体子集的实例代码详解
2020/05/25 Javascript
Openlayers3实现车辆轨迹回放功能
2020/09/29 Javascript
关于IDEA中的.VUE文件报错 Export declarations are not supported by current JavaScript version
2020/10/17 Javascript
JavaScript/TypeScript 实现并发请求控制的示例代码
2021/01/18 Javascript
使用python装饰器验证配置文件示例
2014/02/24 Python
Python编码类型转换方法详解
2016/07/01 Python
opencv实现图片模糊和锐化操作
2018/11/19 Python
使用Python画股票的K线图的方法步骤
2019/06/28 Python
通过实例简单了解Python中yield的作用
2019/12/11 Python
python 实现IP子网计算
2021/02/18 Python
纯CSS改变webkit内核浏览器的滚动条样式
2014/04/17 HTML / CSS
Claire’s法国:时尚配饰、美容、珠宝、头发
2021/01/16 全球购物
写出SQL四条最基本的数据操作语句(DML)
2012/12/12 面试题
员工拾金不昧表扬信
2014/01/09 职场文书
工商行政管理专业求职书
2014/05/23 职场文书
党员一帮一活动总结
2014/07/08 职场文书
机电系毕业生求职信
2014/07/11 职场文书
学校捐书倡议书
2015/04/27 职场文书
煤矿安全生产管理协议书
2016/03/22 职场文书
详细聊聊Oracle表碎片对性能有多大的影响
2022/03/19 Oracle
Python各协议下socket黏包问题原理
2022/04/12 Python