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创建数据共享接口——简化框架之间相互传值
Oct 23 Javascript
使用node.js中的Buffer类处理二进制数据的方法
Nov 26 Javascript
详解JavaScript模块化开发
Dec 04 Javascript
js中作用域的实例解析
Mar 16 Javascript
Node学习记录之cluster模块
May 31 Javascript
微信小程序自定义组件封装及父子间组件传值的方法
Aug 28 Javascript
微信开发之企业付款到银行卡接口开发的示例代码
Sep 18 Javascript
JS面向对象编程实现的Tab选项卡案例详解
Mar 03 Javascript
uniapp与webview之间的相互传值的实现
Jun 29 Javascript
解决在Vue中使用axios POST请求变成OPTIONS的问题
Aug 14 Javascript
vue使用svg文件补充-svg放大缩小操作(使用d3.js)
Sep 22 Javascript
EXTJS7实现点击拖拉选择文本
Dec 17 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下用rmdir实现删除目录的三种方法小结
2008/04/20 PHP
php限制上传文件类型并保存上传文件的方法
2015/03/13 PHP
php从完整文件路径中分离文件目录和文件名的方法
2015/03/13 PHP
Yii2框架实现数据库常用操作总结
2017/02/08 PHP
PHP封装的完整分页类示例
2018/08/21 PHP
JavaScript iframe的相互操作浅析
2009/10/14 Javascript
心扬JS分页函数代码
2010/09/10 Javascript
js中巧用cssText属性批量操作样式
2011/03/13 Javascript
js事件冒泡实例分享(已测试)
2013/04/23 Javascript
只需一行代码,轻松实现一个在线编辑器
2013/11/12 Javascript
jquery限定文本框只能输入数字即整数和小数
2013/11/29 Javascript
类似php的js数组的in_array函数自定义方法
2013/12/27 Javascript
JS模拟简易滚动条效果代码(附demo源码)
2016/04/05 Javascript
利用AJAX实现WordPress中的文章列表及评论的分页功能
2016/05/17 Javascript
JS递归遍历对象获得Value值方法技巧
2016/06/14 Javascript
iframe中使用jquery进行查找的方法【案例分析】
2016/06/17 Javascript
基于jquery实现多级菜单效果
2017/07/25 jQuery
vue.js 获取select中的value实例
2018/03/01 Javascript
微信小程序项目实践之主页tab选项实现
2018/07/18 Javascript
详解处理bootstrap4不支持远程静态框问题
2018/07/20 Javascript
angular1.x ui-route传参的三种写法小结
2018/08/31 Javascript
使用Node.js实现一个多人游戏服务器引擎
2019/03/13 Javascript
js get和post请求实现代码解析
2020/02/06 Javascript
JavaScript实现刮刮乐效果
2020/11/01 Javascript
Python实现简单的可逆加密程序实例
2015/03/05 Python
在Python的Tornado框架中实现简单的在线代理的教程
2015/05/02 Python
python3调用windows dos命令的例子
2019/08/14 Python
CSS3动画animation实现云彩向左滚动
2014/05/09 HTML / CSS
详解移动端HTML5页面端去掉input输入框的白色背景和边框(兼容Android和ios)
2016/12/15 HTML / CSS
寻找完美的房车租赁:RVShare
2019/02/23 全球购物
球队口号
2014/06/18 职场文书
高中综合实践活动总结
2014/07/07 职场文书
个人授权委托书模板
2014/09/14 职场文书
观后感格式
2015/06/19 职场文书
2016年感恩父亲节活动总结
2016/04/01 职场文书
SQL使用复合索引实现数据库查询的优化
2022/05/25 SQL Server