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 相关文章推荐
javascript 获取url参数和script标签中获取url参数函数代码
Jan 22 Javascript
jQuery+ajax中getJSON() 用法实例
Dec 22 Javascript
js实现的早期滑动门菜单效果代码
Aug 27 Javascript
AngularJs bootstrap搭载前台框架——准备工作
Sep 01 Javascript
AngularJs Modules详解及示例代码
Sep 01 Javascript
微信小程序 教程之wxapp视图容器 swiper
Oct 19 Javascript
AngularJS入门教程之与服务器(Ajax)交互操作示例【附完整demo源码下载】
Nov 02 Javascript
JS简单实现表格排序功能示例
Dec 20 Javascript
Nuxt.js踩坑总结分享
Jan 18 Javascript
vue 页面加载进度条组件实例
Feb 05 Javascript
微信小程序http连接访问解决方案的示例
Nov 05 Javascript
vue router带参数页面刷新或回退参数消失的解决方法
Feb 27 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在Web开发领域的优势
2006/10/09 PHP
PHP学习之PHP表达式
2006/10/09 PHP
dojo 之基础篇
2007/03/24 Javascript
javascript concat数组累加 示例
2009/09/03 Javascript
一个关于jqGrid使用的小例子(行按钮)
2011/11/04 Javascript
一个小例子解释如何来阻止Jquery事件冒泡
2014/07/17 Javascript
详解JavaScript ES6中的Generator
2015/07/28 Javascript
浅谈使用MVC模式进行JavaScript程序开发
2015/11/10 Javascript
学习JavaScript设计模式(单例模式)
2015/11/26 Javascript
辨析JavaScript中的Undefined类型与null类型
2016/05/26 Javascript
jQuery插件zTree实现获取一级节点数据的方法
2017/03/08 Javascript
vue.js2.0点击获取自己的属性和jquery方法
2018/02/23 jQuery
vue 中的keep-alive实例代码
2018/07/20 Javascript
判断js数据类型的函数实例详解
2019/05/23 Javascript
nodejs的安装使用与npm的介绍
2019/09/11 NodeJs
[00:32]2018DOTA2亚洲邀请赛Secret出场
2018/04/03 DOTA
[01:04:39]OG vs Mineski 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/18 DOTA
Linux中安装Python的交互式解释器IPython的教程
2016/06/13 Python
实践Vim配置python开发环境
2018/07/02 Python
Python异常处理操作实例详解
2018/08/28 Python
TensorFlow中如何确定张量的形状实例
2020/06/23 Python
python爬取音频下载的示例代码
2020/10/19 Python
python语言time库和datetime库基本使用详解
2020/12/25 Python
Python3利用scapy局域网实现自动多线程arp扫描功能
2021/01/21 Python
全面总结使用CSS实现水平垂直居中效果的方法
2016/03/10 HTML / CSS
CSS3实现莲花绽放的动画效果
2020/11/06 HTML / CSS
英国最大的在线蜡烛商店:Candles Direct
2019/03/26 全球购物
送给程序员的20个Java集合面试问题
2014/08/06 面试题
九年级数学教学反思
2014/02/02 职场文书
关爱留守儿童倡议书
2014/04/15 职场文书
司机个人年终总结
2015/03/03 职场文书
2015年办公室个人工作总结
2015/04/20 职场文书
公司管理建议书
2015/09/14 职场文书
CSS中em的正确打开方式详解
2021/04/08 HTML / CSS
pytorch查看网络参数显存占用量等操作
2021/05/12 Python
为什么MySQL分页用limit会越来越慢
2021/07/25 MySQL