网页实时显示时间_html页面布局代码

网页实时显示时间_html页面布局代码在html页面实时显示系统时间桌面新建记事本,将下列代码复制粘贴,重命名后缀为.html,保存,用浏览器打开即可<html><head><metahttp-equiv=”Content-Type”content=”text/html;charset=utf-8″/><title>系统时间</title&gt…

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

在html页面实时显示系统时间

桌面新建记事本,将下列代码复制粘贴,重命名后缀为.html,保存,用浏览器打开即可

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>系统时间</title>
</head>
<body>
<div id="datetime">
    <script>
        setInterval("document.getElementById('datetime').innerHTML=new Date().toLocaleString();", 1000);
    </script>
</div>
</body>

代码解析:

new Date()是取现在系统时间的实例,其格式为:
	显示的结果是:Mar 31 10:10:43 UTC+0800 2018 这种格式的时间

但是当这种对象参加计算后就会自动改变格式为:年月日 时分秒

toLocaleString()便是将该对象在本地打印,自动转换了格式为:
	2018/11/5 下午1:18:17 或 2018年11月5日 13:19:14 (取决于不同的浏览器)

这个方法是循环方法,后面的1000是毫秒数,每单位毫秒数执行一次前面的xxx

setInterval("xxx",1000);

这句话的操作就是,每1000毫秒(即1秒),取当前时间打印更新在页面该标签里,实现系统时间实时显示

=======================我是一条温柔的分割线=======================

有网友提出格式化成”yyyy-MM-dd hh:mm:ss”的问题,我在这里更新一下:

桌面新建记事本,将下列代码复制粘贴,重命名后缀为.html,保存,用浏览器打开即可

<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>系统时间</title>
</head>

<body>
    <script>
        Date.prototype.format = function (fmt) {
            var o = {
                "y+": this.getFullYear, //年
                "M+": this.getMonth() + 1, //月份
                "d+": this.getDate(), //日
                "h+": this.getHours(), //小时
                "m+": this.getMinutes(), //分
                "s+": this.getSeconds() //秒
            };
            if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
            for (var k in o)
                if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
            return fmt;
        }
        setInterval("document.getElementById('dateTime').innerHTML = (new Date()).format('yyyy-MM-dd hh:mm:ss');", 1000);
    </script>

    <div id="dateTime"></div>
</body>

运行结果:

网页实时显示时间_html页面布局代码

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/197552.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)
blank

相关推荐

  • 微信公众号平台图片上传失败不知道是哪张_看公众号的同时回微信

    微信公众号平台图片上传失败不知道是哪张_看公众号的同时回微信获取图片链接:http://file.api.weixin.qq.com/cgi-bin/media/get?access_token={0}&media_id={1}如今会提示错误{&qu

  • scala隐式转换[通俗易懂]

    scala隐式转换[通俗易懂]简述:1:通过隐式转换,程序员可以在编写Scala程序时故意漏掉一些信息,让编译器去尝试在编译期间自动推导出这些信息来,这种特性减少代码量,忽略那些冗长的代码。2:我们经常引入第三方库,但当我们想要扩展新功能的时候通常是很不方便的,因为我们不能直接修改其代码。scala提供了隐式转换机制和隐式参数帮我们解决诸如这样的问题。Scala中的隐式转换是一种非常强大的代码查找机制。当函数、构造器调用缺少参数或者某一实例调用了其他类型的方法导致编译不通过时,编译器会尝试搜索一些特定的区域,尝试使编译

  • idea快捷键不生效_idea列模式快捷键

    idea快捷键不生效_idea列模式快捷键1、如果是某些快捷键不气作用,这有可能与通讯工具、输入法、浏览器等的快捷键冲突2、如果所有的快捷键都不气作用,这时点击idea开发工具上的“Tools”然后将”VimEmulator”这个选项的√去掉。如图…

  • 向navicat中导入数据库时出现错误_mysql数据库怎么导出

    向navicat中导入数据库时出现错误_mysql数据库怎么导出在Navicat导出的 或者别的sql文件,在使用Navicat导入时候 出现异常失败报错问题。搜索了很多资料查看,发现是没有解决掉的。最后无意间想起使用 MySql 直接使用命令导入尝试,发现可行的简单粗暴,直接打开你的MySql 登录以后 选择 要导入的数据库use 数据库名称;source 文件的绝对路径;完事 ,坐等~…

  • static 关键字和类的加载顺序

    static 关键字和类的加载顺序

  • 临界区 互斥量 事件 信号量_互斥信号量与同步信号量

    临界区 互斥量 事件 信号量_互斥信号量与同步信号量四种进程或线程同步互斥的控制方法:1、临界区:通过对多线程的串行化来访问公共资源或一段代码,速度快,适合控制数据访问。2、互斥量:为协调共同对一个共享资源的单独访问而设计的。3、信号量:为控制一个具有有限数量用户资源而设计。4、事 件:用来通知线程有一些事件已发生,从而启动后继任务的开始。临界区(Critical Section)保证在某一时刻只有一个线程能访问数据的简便办法。在任意…

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号