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 相关文章推荐
jquery常用技巧及常用方法列表集合
Apr 06 Javascript
JavaScript内存管理介绍
Mar 13 Javascript
javascript实现一个数值加法函数
Jun 26 Javascript
JS实现Fisheye效果动感放大菜单代码
Oct 21 Javascript
微信小程序 倒计时组件实现代码
Oct 24 Javascript
jquery结合html实现中英文页面切换
Nov 29 Javascript
微信小程序网络请求的封装与填坑之路
Apr 01 Javascript
微信小程序图片选择、上传到服务器、预览(PHP)实现实例
May 11 Javascript
微信小程序点击图片实现长按预览、保存、识别带参数二维码、转发等功能
Jul 20 Javascript
JavaScript 截取字符串代码实例
Sep 05 Javascript
vue组件实现移动端九宫格转盘抽奖
Oct 16 Javascript
vue组件的路由高亮问题解决方法
May 11 Vue.js
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转成EXE文件
2006/10/09 PHP
解析php中获取系统信息的方法
2013/06/25 PHP
PHP使用CURL获取302跳转后的地址实例
2014/05/04 PHP
php实现与python进行socket通信的方法示例
2017/08/30 PHP
jquery.validate分组验证代码
2011/03/17 Javascript
dreamweaver 安装Jquery智能提示
2011/04/02 Javascript
jQuery 下拉列表 二级联动插件分享
2012/03/29 Javascript
JS生成不重复随机数组的函数代码
2014/06/10 Javascript
基于NodeJS的前后端分离的思考与实践(二)模版探索
2014/09/26 NodeJs
浅析2种JavaScript继承方式
2015/12/04 Javascript
基于jQuery实现交互体验社会化分享代码附源码下载
2016/01/04 Javascript
Angular.js与Bootstrap相结合实现表格分页代码
2016/04/12 Javascript
BootStrap文件上传样式超好看【持续更新】
2016/05/10 Javascript
JavaScript实现格式化字符串函数String.format
2016/12/16 Javascript
Vue + Webpack + Vue-loader学习教程之相关配置篇
2017/03/14 Javascript
详解基于 axios 的 Vue 项目 http 请求优化
2017/09/04 Javascript
p5.js入门教程之键盘交互
2018/03/19 Javascript
vue19 组建 Vue.extend component、组件模版、动态组件 的实例代码
2019/04/04 Javascript
使用异步组件优化Vue应用程序的性能
2019/04/28 Javascript
vue实现菜单切换功能
2019/05/08 Javascript
微信小程序左右滚动公告栏效果代码实例
2019/09/16 Javascript
Vue 3.0 全家桶抢先体验
2020/04/28 Javascript
[05:41]2014DOTA2西雅图国际邀请赛 小组赛7月10日TOPPLAY
2014/07/10 DOTA
跟老齐学Python之用Python计算
2014/09/12 Python
利用Python的Flask框架来构建一个简单的数字商品支付解决方案
2015/03/31 Python
Python常用模块之requests模块用法分析
2019/05/15 Python
python如何制作英文字典
2019/06/25 Python
使用python进行广告点击率的预测的实现
2019/07/04 Python
应聘教师推荐信
2013/10/31 职场文书
求职自荐信怎么写
2014/03/06 职场文书
庆祝国庆节标语
2014/10/09 职场文书
贷款收入证明格式
2015/06/24 职场文书
spring cloud eureka 服务启动失败的原因分析及解决方法
2022/03/17 Java/Android
Python自动化实战之接口请求的实现
2022/05/30 Python
CSS控制继承中的height能变为可继承吗
2022/06/10 HTML / CSS
nginx之内存池的实现
2022/06/28 Servers