HTML：在浏览器页面上简单实现显示标准系统时间

运用到了HTML JavaScript中的Date对象，并按 “日期时间星期” 格式输出，且要求为除年份外皆为两位（不足两位前补0），最后的全代码如下

<!DOCTYPE html>
<html><head><script>function time(){var date = new Date();var year = date.getFullYear();var month = date.getMonth()+1;var day = date.getDate();var week = date.getDay();week="星期"+"日一二三四五六".charAt(week);var hour = date.getHours();var minute = date.getMinutes();var second = date.getSeconds();var temp=[month,day,hour,minute,second];for (var i in temp) {temp[i]=temp[i]<10?"0"+temp[i]:temp[i];}var currentTime = year +"-"+ temp[0] +"-"+ temp[1] +" "+ temp[2] +":"+ temp[3] +":"+ temp[4] +" "+week;document.getElementById("time").innerHTML = currentTime;}setInterval("time()",1000);</script></head><body onload="time()"><span id="time"></span></body>
</html>

优化：1.其中补足两位代码本来用每行变量下加三目运算符实现

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 week = date.getDay();
var weeks="星期"+"日一二三四五六".charAt(week);
var hour = date.getHours();
hour = hour<10?"0"+hour:hour;
var minute = date.getMinutes();
minute = minute<10?"0"+minute:minute;
var second = date.getSeconds();
second = second<10?"0"+second:second;
document.getElementById("time").innerHTML=year+"-"+month+"-"+day+"-"+hour+"-"+minute+"-"+second+"-"+week;

后为减少代码量，结合以前所学改用数组改进了一下

 var temp=[month,day,hour,minute,second];for (var i in temp) {temp[i]=temp[i]<10?"0"+temp[i]:temp[i];}var currentTime = year +"-"+ temp[0] +"-"+ temp[1] +" "+ temp[2] +":"+ temp[3] +":"+ temp[4] +" "+week;

2. 关于星期 getDay()的默认值为0~6，显示要成中文的数字，不能简单的加1，本是用switch结构使0~6对应到日~六，这样的代码量也较多，后使用了charAt（），恰好week变量的值为常数，较简单的地实现了显示星期

var week="星期"+"日一二三四五六".charAt(week);

HTML：在浏览器页面上简单实现显示标准系统时间相关推荐

html页面在ie上出现404怎么解决,ie浏览器网页上有错误显示不全的解决方法
ie浏览器网页上有错误显示不全的解决方法有时候打开网页发现内容的排版比较混乱,比如上下两行的文字部分重叠,字体大小看起来很不协调,本来是一行的文字显示成两行,等等.这是因为浏览器的设置出了问题,很多 ...
php上传多张图片为什么只显示一张,javascript,_js多张图片上传也拿到多张图片的路径在页面上展示只显示一张？只执行了一次？？？，javascript - phpStudy...
js多张图片上传也拿到多张图片的路径在页面上展示只显示一张?只执行了一次??? js多张图片上传也拿到多张图片的路径在页面上展示只显示一张?只执行了一次??? self.$els.upload ...
解决Mac电脑显示的系统时间不准确的方法
当我们在使用Mac电脑的时候,发现Mac电脑显示的系统时间不准确该怎么办呢?方法很简单,只需几个简单步骤就可以了,需要的朋友欢迎参考操作! 具体解决方法如下 1.在苹果电脑的程序坞,打开[系统偏好设置 ...
如何解决Mac电脑显示的系统时间不准确的问题？
当我们在使用Mac电脑的时候,发现Mac电脑显示的系统时间不准确该怎么办呢?方法很简单,只需几个简单步骤就可以了,需要的朋友欢迎参考操作! 具体解决方法如下 1.在苹果电脑的程序坞,打开[系统偏好设置 ...
使用javascript技术制作，打开网页后，根据当前时间，显示：上午，下午，或晚上好，并显示当前系统时间0-12 点上午12点到18下午其他时间是晚上
打开网页后 ,根据当前时间,显示:上午 ,下午,或晚上好,并显示当前系统时间 0-12 点上午 12点到18下午其他时间是晚上精确到秒每秒都自动刷新 <!DOCTYPE ht ...
html之设置页面ico图标ie浏览器,如何修改网页小图标，浏览器页面上的图标（favicon.ico）...
我们在查看网页的时候很多那么如何更改这个图标呢?两种方式. 第一种方式: 1.找到已经安装的tomcat目录,进入D: omcatapache-tomcat-7.0.50-1webappsROOT目 ...
网页显示服务器系统时间,客户端实现正确的服务器时间同步 [转]
一.问题描述需要解决的问题很简单,就是如何在页面上比较准确的显示服务器时间.目前比较常用的方法就是根据基准时间使用setTimeout或 setInterval来计算最新的时间,这样的问题在于set ...
JS(截取字符串,显示当前系统时间yyyy-MM-dd,从文本框得到的数值计算)
截取字符串: Js代码 var str = "1234567890"; var a = str.substring(0,8); //==str.substring(8)- ...
45 WebGL在页面上添加hud显示
案例查看地址:点击这里平视显示器(head up display)简称HUD,最早用于飞机驾驶.平视显示器将一些重要信息投射到飞机驾驶舱前方的一块玻璃上,飞行员能够将外界的影像和这些重要的信息融合在 ...

HTML：在浏览器页面上简单实现显示标准系统时间

HTML：在浏览器页面上简单实现显示标准系统时间相关推荐

最新文章

热门文章