在HTML页面中显示当前时间

1.源码

<!DOCTYPE html>
<html><head><meta charset="utf-8" /><title></title><style type="text/css">span{display: inline-block;/*border: 1px solid black;*//*background-color: yellow;*/font-family: 华文行楷;}span:hover{background-color: pink;cursor: pointer;}</style></head><body><span id="time"></span><script>var show= function(){var date = new Date();var year = date.getFullYear();var month = date.getMonth()+1;month= month<10?"0"+month:month;var day = date.getDate();//获取日期day= day<10?"0"+day:day;var hour = date.getHours();hour= hour<10?"0"+hour:hour;var minute = date.getMinutes();minute= minute<10?"0"+minute:minute;var week = date.getDay();//获取星期var second=date.getSeconds();second= second<10?"0"+second:second;week = "日一二三四五六".charAt(week);week="星期"+week;result=year+"-"+month+"-"+day+" "+week+" "+hour+":"+minute+":"+second;document.getElementById("time").innerHTML=result;}show();setInterval("show()",1000);</script></body>
</html>

2.介绍

JS内置对象Date的使用

js中有内置的对象，Date就是其中一个。

getFullYear():获取年份 getMonth()获取月份 getDate():获取一个月中的某一天 getDay():获取一周中的某一天等等。
注意：

因为转化日期的时候，getDay（）返回的是int类型。不符合常见的日期显示方式，所以需要将其转换为字符串类型的进行显示。

代码如下
```
switch (week){case 1:week="星期一";break;case 1:week="星期一";break;case 2:week="星期二";break;case 3:week="星期三";break;case 4:week="星期四";break;case 5:week="星期五";break;case 6:week="星期六";break;case 0:week="星期日";break;default:break;}
```
但是如果在HTML页面中写入如上代码，回导致整个代码十分冗余。在这里可以使用内置类String的方法charAt（）根据索引返回字符串的某个位置的字符

简化后的代码如下
```
week = "日一二三四五六".charAt(week);
week="星期"+week;
```
由于JS是弱类型语言，所以可以直接将int类型的的数据转换为字符串类型。

HTML页面中显示时间相关推荐

linux 命令提示符时间,在LINUX的命令提示符及CMD命令提示符中显示时间
用途之一是可以查看某个命令或程序的执行时间. 一.CMD中显示时间设置参数说明: $P:当前路径 $G:>(大于号) $T:当前时间,精确到0.01s 实验如下: C:\Users\g4-10 ...
clr20r3错误问题定位与解决_解决Power BI服务中显示时间错误的问题
本文来自PowerBI星球嘉宾AgnesJ的分享,关于PowerBI Service 中显示时间的问题. 也许很多人都遇到过这个困惑,做好的可以正常显示本地时间的报告,发布到web后,时间却不正确了 ...
php json转数组后并在前端展示,0516-如何从服务器端获取JSON格式字符串并解决到前端页面中显示...
一. 如何从服务器端获取JSON格式字符串并解决到前端页面中显示 1.采用AJAX异步方式从服务器请求必须为字符串的数据:例如 $PHP= '{"aaa":"bbb&q ...
java错误页面显示错误信息_Struts2在JSP页面中显示错误信息和提示信息的方法
Struts2在JSP页面中显示错误信息和提示信息的方法主要有以下四种. 注意:以下四种方法均需要使Action类继承ActionSupport类. 一.域级错误信息 ①重写Action中的valid ...
[置顶] 读取pdf并且在web页面中显示
读取pdf并且在web页面中显示 if (System.IO.File.Exists(f)) { Response.ContentType = "applicationpdf"; ...
IT兄弟连 JavaWeb教程使用Servlet实现在页面中显示随机数
在com.xdl.servlet包下定义RandomServlet类并HttpServlet类,在该类中生成随机数并发送给客户端.RandomServlet类详细代码如下: package com.x ...
微信小程序showToast在真机中显示时间不可控制，显示时间短
现象: 使用uniapp开发微信小程序,使用showToast,设置duration来控制提示展现时长,发现在微信开发者工具正常,在真机中显示时间比较短,并且设置duration不生效. 原因: 排查 ...
cmd怎么进入linux系统时间,在LINUX的命令提示符及CMD命令提示符中显示时间
用途之一是可以查看某个命令或程序的执行时间. 一.CMD中显示时间设置参数说明: $P:当前路径 $G:>(大于号) $T:当前时间,精确到0.01s 实验如下: C:\Users\g4-10 ...
php实现wav转mp3,php实现将wav文件转换成图像文件并在页面中显示的方法
本文实例讲述了php实现将wav文件转换成图像文件并在页面中显示的方法.分享给大家供大家参考.具体分析如下: 需求:将wav文件转换成png文件并且显示出来. Wav_To_Png.php: func ...
react方法返回html_#react# 在页面中显示html代码块
在页面中显示html代码块在网上查了下,说有一下方法可以把html代码直接在页面中输出. textarea 不让编辑去边框去滚动条直接把代码用ps做成图片上传到网页用转换符号在jsx中前面 ...

HTML页面中显示时间

在HTML页面中显示当前时间

1.源码

2.介绍

HTML页面中显示时间相关推荐

最新文章

热门文章