js时间日期显示

最新推荐文章于 2022-08-06 10:34:38 发布
最新推荐文章于 2022-08-06 10:34:38 发布
阅读量805 收藏
点赞数
分类专栏： JS 
<html>

<head>

<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">

//定义月历函数

function calendar() {

var today = new Date(); //创建日期对象

year = today.getYear(); //读取年份

thisDay = today.getDate(); //读取当前日

//创建每月天数数组

var monthDays = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);

//如果是闰年，2月份的天数为29天

if (((year % 4 == 0) && (year % 100 != 0)) || (year % 400 == 0)) monthDays[1] = 29;

daysOfCurrentMonth = monthDays[today.getMonth()]; //从每月天数数组中读取当月的天数

firstDay = today;//复制日期对象

firstDay.setDate(1); //设置日期对象firstDay的日为1号

startDay = firstDay.getDay(); //确定当月第一天是星期几

//定义周日和月份中文名数组

var dayNames = new Array("星期日","星期一","星期二","星期三","星期四","星期五","星期六");

var monthNames = new Array("1月","2月","3月","4月","5月","6月","7月","8月","9月","10月","11月","12月");

//创建日期对象

var newDate = new Date();

//创建表格

document.write("<TABLE BORDER='0' CELLSPACING='0' CELLPADDING='2' ALIGN='CENTER' BGCOLOR='#0080FF'>")

document.write("<TR><TD><table border='0' cellspacing='1' cellpadding='2' bgcolor='#88FF99'>");

document.write("<TR><th colspan='7' bgcolor='#C8E3FF'>");

//显示当前日期和周日

document.writeln("<FONT STYLE='font-size:9pt;Color:#FF0000'>" + newDate.getYear() + "年" + monthNames[newDate.getMonth()] + " " + newDate.getDate() + "日 " + dayNames[newDate.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(" <TD><FONT STYLE='font-size:9pt'> </FONT></TD>");

column++;

}

//如果是当前日就突出显示(红色)，否则正常显示(黑色)

for (i=1; i<=daysOfCurrentMonth; i++) {

if (i == thisDay) {

document.writeln("</TD><TD ALIGN='CENTER'><FONT STYLE='font-size:9pt;Color:#ff0000'><B>")

}

else {

document.writeln("</TD><TD BGCOLOR='#88FF99' ALIGN='CENTER'><FONT STYLE='font-size:9pt;font-family:Arial;font-weight:bold;Color:#000000'>");

}

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='time' onSubmit='0'><FONT STYLE='font-size:9pt;Color:#ffffff'>")

//显示当前时间

document.writeln("当前时间:<INPUT TYPE='Text' NAME='textbox' ALIGN='TOP'></FONT></TD></TR></TABLE>")

document.writeln("</TD></TR></TABLE></FORM>");

}

</SCRIPT>

<SCRIPT LANGUAGE="JavaScript">

//初始化控制变量

var timerID = null;

var timerRunning = false;

//定义时间显示函数

function stoptime (){

if(timerRunning)

clearTimeout(timerID);

timerRunning = false;}

//定义显示时间函数

function showtime () {

var newDate = new Date();

var hours = newDate.getHours();

var minutes = newDate.getMinutes();

var seconds = newDate.getSeconds()

var timeValue = " " + ((hours >12) ? hours -12 :hours)

timeValue += ((minutes < 10) ? ":0" : ":") + minutes

timeValue += ((seconds < 10) ? ":0" : ":") + seconds

timeValue += (hours >= 12) ? " 下午 " : " 上午 "

document.time.textbox.value = timeValue;

timerID = setTimeout("showtime()",1000);//设置超时,使时间动态显示

timerRunning = true;}

//显示当前时间

function starttime () {

stoptime();

showtime();}

</SCRIPT>

</head>

<BODY onLoad="starttime()" TEXT="#000000" TOPMARGIN="0">

<script language="JavaScript" type="text/javascript">

calendar(); //显示月历

</script>

</BODY>

</html>

 

显示效果如下：

转载地址： http://zhidao.baidu.com/question/172552267.html
叮咚侠
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
js实时显示日期时间代码
LauEl-的博客
05-18 122
【代码】js实时显示日期时间代码。
js获取当前日期时间
nolanElio的博客
04-13 3584
function Thistime() { //当前日期 var date = new Date(); var year = date.getFullYear(); var month = date.getMonth() + 1; var day = date.getDate(); var mytime=date.toLocaleTimeString(); //获取当前时间 // myDate.toLocaleString( )
JS实现日期时间动态显示的方法
11-23
本文实例讲述了JS实现日期时间动态显示的方法。分享给大家供大家参考，具体如下： 运行效果截图如下： 具体代码如下： <html> <head> <title>js日期时间动态显示</title> </head> <body> <div id='jnkc'></div> [removed]setInterval("jnkc[removed]=new Date().toLocaleString()+' 星期'+'日一二三四五六'.charAt(new Date().getDay());",1000); [removed] </body> </html> 希望本文所述对大家Java
javaScript时间动态显示
h
07-11 3452
借助javaScript实现时间动态显示 <script language="JavaScript"> function startTime() { var today=new Date();//定义日期对象 var yyyy = today.getFul
Js实现实时显示系统时间（获取当前时间并显示）
热门推荐
琅枫的博客
04-19 4万+
js可以通过Date对象获取当前日期和时间，使用Date()获取系统当前时间，在使用getFullYear()、getMonth()、getDate() 、getHours()等方法获取特定格式的时间，在使用innerHTM方法显示。 首先我们来了解一下js获取当前时间所需的一些方法： 获取当前时间： var d = new Date();//获取系统当前时间 获取特定格式的时间： 1、获取当前年份 getYear()方法：可以获取年份（2位或4位），其返回值是表示当前Date 对象的年份字段 说明：当年
JS在页面动态显示日期与时间
qq_35354139的博客
08-06 1762
JS在页面里动态显示日期与时间
用js显示日期时间
m0_52434369的博客
06-30 951
用js在页面上显示时间，日期，以s为单位更新，有详细的注解。对才接触js的小白超级友好，可以直接复制代码看效果哟！ <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width
js显示时间日期
01-13
### JavaScript 实现动态显示当前时间日期 在网页开发过程中，我们常常需要在页面上动态地显示当前的时间和日期。这不仅可以提升用户体验，还能为开发者提供更丰富的功能选项，例如记录日志、定时任务等。本文将...
js显示当前日期时间和星期几
11-25
在给定的标题和描述中，我们关注的是如何使用JavaScript来获取并显示当前的日期、时间以及星期几。下面将详细解释相关知识点。 1. **Date对象**： JavaScript中的`Date`对象是处理日期和时间的核心，可以用来创建...
用js实现页面显示当前日期和时间的代码
10-30
js时间日期显示效果代码
js+数组实现网页上显示时间/星期几的实用方法
11-30
代码如下: <html> <head> [removed] function startTime() { var today=new Date() var h=today.getHours() var m=today.getMinutes() var s=today.getSeconds() // add a zero in front of numbers<10 m=checkTime(m) s=checkTime(s) document.getElementById(‘txt’)[removed]=h+”:”+m+”:”+s t=setTime
显示当前时间和日期
02-23
Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click TextBox1.Text = Now End Sub
显示时间和日期
07-10
显示时间和日期的小程序 简单界面 十分适合初学者
js显示实时日期和时间
shaonian1996
08-24 2万+
js显示实时日期和时间 原理：每隔1s重新获取一下时间并显示出来 结果图示：  代码： &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;title&gt;首页&lt;/title&gt; &lt;/head&gt; &lt;body&a
实现时间和日期的显示
JSZY-YYDS的博客
05-18 2412
实现时间和日期的显示 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 开发工具与关键技术： DW 作者：韩日九儿 撰写时间：2021/5/2 1.点击开始能够实现时间和日期的显示，这里的时间和日期是当前的时间和日期。 2.点击开始获取当前时间和日期，点击暂停时间和日期暂停，这个是可以循环的。 3.视图开始的结构如下。 4.这里用到了时间对象Da...
时间日期显示格式
weixin_45677987的博客
04-14 967
1： 时间日期显示格式： <el-form-item :label="日期范围"> <el-date-picker v-model="timeRange" type= "daterange" range-separator="至" start-placeholder = "开始时间" end - placehodler = "结束时间" format = "yyyy 年 MM 月 dd 日" .
JavaScript显示日期，电子钟的制作
渔闻520的博客
07-29 1636
定义日期 用 var date=new Date()来定义日期对象。 可以用toUTCString()的方法来显示当前的具体时间 ex： var d=new Date(); document.write(d.toUTCString()); 返回当前日的日期 直接使用Date()即可。 ex： document.write(Date()); 则显示:Sat Jul 28 201...
js实现动态显示时间
Smile yourlife
03-30 2327
//得到当前时间 var date = new Date(); //格式化为本地时间 var d1 = date.toLocaleString(); //使页面每秒显示一次时间 setInterval() //定时器实现 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>动态显示时间</title>
js显示每秒变化的日期时间
最新发布
06-06
你可以使用 JavaScript 的 Date 对象和 setInterval 函数来实现每秒变化的日期时间显示。以下是一个示例代码： ```javascript function updateTime() { var date = new Date(); // 获取当前时间 var year = date....
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值