HTML：使用JavaScript（js）脚本在网页上显示实时时间

hello，大家好，我是wangzirui32，今天我们来学习如何在网页上显示当前时间。
话不多说，首先创建一个js脚本文件，命名为timeShow.js，代码如下（不懂的地方看注释）：

// 定义time函数
function time(){// 创建一个日期对象date = new Date();// 获取当前年 需要加上1900var year = date.getYear() + 1900;// 当前月 需要加上1var month = date.getMonth() + 1;// 当前日var day = date.getDate();// 当前星期// 说明：getDay返回一个数字，这个数字就是在下方列表的其中一个索引var weekdayList = ["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];var weekday = weekdayList[date.getDay()];// 当前时var hours = date.getHours();// 当前分var minutes = date.getMinutes();// 当前秒var seconds = date.getSeconds();// 由于字符串太长 分为两段来写，效果是一样的var write_content = "现在的时间为：" + year + "年" + month + "月" + day + "日" + weekday;// 说明：" "是空格，用来隔开星期和小时write_content = write_content +  " " + hours + "时" + minutes + "分" + seconds + "秒";// 将id为timeShow的标签 文本内容设置为write_content字符串的内容document.getElementById("timeShow").innerHTML = write_content;
}// 设置运行间隔 每1000毫秒，也就是1秒运行一次time函数
setInterval(time,1000);

再在同样的目录下创建一个HTML文件，写入：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>显示HTML时间</title><script src="timeShow.js"></script>
</head>
<body><div id="timeShow"></div>
</body>
</html>

script加载脚本文件，再创建一个id为timeShow的div标签。
最后，你也可以重新编写js脚本文件里的代码，获取不同格式的时间，比如只获取月日，只获取时分秒等，这些大家可以自己去尝试，这里不再赘述。
打开浏览器，你就可以看见实时变动的时间了！
对HTML不了解的建议你去博主的文章HTML网页标签代码基本教学看看，感兴趣可以收藏点赞哦！

HTML：使用JavaScript（js）脚本在网页上显示实时时间相关推荐

vs2008C#网页实现显示实时时间
第一次接触这个东西,什么都不懂,好在看过几天的html5,对一些通用标签还是了解一点的. 在实现功能之前,查阅了很多代码,结果发现根本跑不起来,由于不懂C#这东西,在实现时间功能时遇到了很大的困难,在 ...
怎样在html中显示时间,如何在网页上显示当前时间
最近做的页面中有需要在页面直接显示当前时间的功能,一开始不知道怎么实现,后来经过查找资料来实现了该功能.虽然用过该功能的人会觉得很简单,但是在这里还是想总结出来,可以供不熟悉的人参考一下. 具体实现代 ...
html英文日期js,JS网页上显示中英文版日期时间(根据电脑上的时间)
JS网页上显示中英文版日期时间(根据电脑上的时间) <script language="javascript"> function shownowtime() { va ...
如何在html上显示时间设置,js实现在网页上简单显示时间的方法
本文实例讲述了js实现在网页上简单显示时间的方法.分享给大家供大家参考.具体如下: 这是一款网页时钟JS代码,纯javascript实现,显示时.分.秒.网页时间显示.网页时钟有很多,这个真的挺简易的 ...
js实现截取网页上特定位置的图片打印或保存
js实现截取网页上特定位置的图片打印或保存一.实现思路具体思路是创建一个宽和高都是100%的canvas,使其能够覆盖整个页面,然后根据所要截取的图片起始位置相对于canvas的位置(因为是1 ...
js脚本实现网页自动刷新
js脚本实现网页自动刷新 //网页自动刷新代码 timeout=prompt("Set timeout (Second):"); count=0 current=location. ...
3D模型在网页上显示
3D模型在网页上显示,这绝对是未来的趋势,也是热门.一部"阿凡达"让电影节发生了一次地震,让人们感到3D的时代到来.那么我们IT界呢?如果各位因工作时间繁忙,或者嫌上海世博会人山人 ...
图片的base64编码实现以及网页上显示
生成.解析base64编码的图片 //图片转化成base64字符串 public static String GetImageStr(<span style="font-family: ...
php导入qq数据txt代码,/谁有能都实现将excel文件导入到数据中，并在php网页上显示的源码啊，有的发送1091932879@qq.com,谢谢!...
PHP网页怎么导入Excel的数据参码如下: // 1.引用ExcelReader类文 require_once 'Excel/reader.php'; // 2.实例化读取Excel类 $data ...
Markdown转html在网页上显示
Markdown转html在网页上显示 1.需要安装的内容 npm install showdown showdown 详解 npm install showdown-katex showdown-k ...

HTML：使用JavaScript（js）脚本在网页上显示实时时间

HTML：使用JavaScript（js）脚本在网页上显示实时时间相关推荐

最新文章

热门文章