1.在body里面使用onload和在函数中使用setTimeout来实现当前的日期时间不断变化

2.在script中直接是用setInterval实现当前实现的日期时间不断变化

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title></title>

    </head>

    <body onload="fun()">

        <p id="demo"></p>

    <script>

        function fun()

        {var date=new Date();

        var year=date.getFullYear();

        var month=date.getMonth()+1;//这里用函数获取的日期是从0-11，所以要加1

        var datte=date.getDate();

        var hour=date.getHours();

        var minute=date.getMinutes();

        var second=date.getSeconds();

        if(minute<10)

        minute="0"+minute;

        if(second<10)

        second="0"+second;

        document.getElementById("demo").innerHTML=year+"年"+month+"月"+datte+"日"+hour+":"+minute+":"+second;

         setTimeout("fun()",1);

        }

    </script>

    </body>

</html>
<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title></title>

    </head>

    <body >

        <p id="demo"></p>

    <script>

        window.onload=fun();//单独这样写会更好

    function fun()

        {var date=new Date();

        var year=date.getFullYear();

        var month=date.getMonth()+1;

        var datte=date.getDate();

        var hour=date.getHours();

        var minute=date.getMinutes();

        var second=date.getSeconds();

        if(minute<10)

        minute="0"+minute;

        if(second<10)

        second="0"+second;

        document.getElementById("demo").innerHTML=year+"年"+month+"月"+datte+"日"+hour+":"+minute+":"+second;

         setTimeout("fun()",1);//使用clearTimeout来清除

        }

    </script>

    </body>

</html>
<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title></title>

    </head>

    <body >

        <p id="demo"></p>

    <script>

    function fun()

        {var date=new Date();

        var year=date.getFullYear();

        var month=date.getMonth()+1;

        var datte=date.getDate();

        var hour=date.getHours();

        var minute=date.getMinutes();

        var second=date.getSeconds();

        if(minute<10)

        minute="0"+minute;

        if(second<10)

        second="0"+second;

        document.getElementById("demo").innerHTML=year+"年"+month+"月"+datte+"日"+hour+":"+minute+":"+second;

        }

     setInterval("fun()",1);//自动循环，使用clearInterval来清除

    </script>

    </body>

</html>

时间会变化，秒钟更为明显

使用onload和setTimeout、setInterval来实现当前的时间的更多相关文章

  1. js,onblur后下一个控件获取焦点判断、html当前活跃控件、jquery版本查看、jquery查看浏览器版本、setTimeout&setInterval

    需求: input控件在失去焦点后直接做验证,验证通不过的话,显示相应错误.但是如果失去焦点后点击的下个控件是比较特殊的控件(比如,退出系统),那么不执行验证操作,直接退出系统(防止在系统退出前,还显 ...

  2. setTimeout/setInterval执行时机

    setTimeout()和setInterval()经常被用来处理延时和定时任务.setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式,而setInterval()则可以在每隔指定的 ...

  3. js中setTimeout/setInterval定时器用法示例

    js中setTimeout(定时执行一次)和setInterval(间隔循环执行)用法介绍. setTimeout:在指定的毫秒数后调用指定的代码段或函数:setTimeout示例代码 functio ...

  4. setTimeout,setInterval你不知道的…

    javascript线程解释(setTimeout,setInterval你不知道的事) 标签: javascript引擎任务浏览器functionxmlhttprequest 2011-11-21 ...

  5. setTimeout,setInterval你不知道的事

    javascript线程解释(setTimeout,setInterval你不知道的事) 标签: javascript引擎任务浏览器functionxmlhttprequest 2011-11-21 ...

  6. js异步处理工作机制(setTimeout, setInterval)

    经常谈到异步,但是发现自己一直没深入理解setTimeout, setInterval,逛论坛的时候发现了这篇好文章,分享一下. ————————————————————以下为原文—————————— ...

  7. 管理页面的 setTimeout & setInterval

    在管理 setTimeout & setInterval 这两个 APIs 时,笔者通常会在顶级(全局)作用域创建一个叫 timer 的对象,在它下面有两个数组成员 —— {sto, siv} ...

  8. js setInterval每隔一段时间执行一次

    js setInterval每隔一段时间执行一次setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式.setInterval() 方法会不停地调用函数,直到 clearI ...

  9. window对象方法之setTimeout(),setInterval()

    window中的这两个方法是比较重要的,在许多的设计中会使用到这两个方法.比如使用在倒计时抢购中. 首先来说说这两个方法的用法吧! 一:window.setTimeout(); setTimeout( ...

随机推荐

  1. Java实现 LeetCode 763 划分字母区间（暴力）

    763. 划分字母区间 字符串 S 由小写字母组成.我们要把这个字符串划分为尽可能多的片段,同一个字母只会出现在其中的一个片段.返回一个表示每个字符串片段的长度的列表. 示例 1: 输入: S = & ...

  2. Java实现 LeetCode 752 打开转盘锁（暴力）

    752. 打开转盘锁 你有一个带有四个圆形拨轮的转盘锁.每个拨轮都有10个数字: '0', '1', '2', '3', '4', '5', '6', '7', '8', '9' .每个拨轮可以自由旋 ...

  3. Java实现LeetCode_0007_ReverseInteger

    package javaLeetCode_primary; import java.util.Scanner; /** * Given a 32-bit signed integer, reverse ...

  4. Linux 日志管理简介

    查看日志rsyslogd是否启动和自启动 ps aux | grep rsyslogd 查看自启动(CentOS 7使用,CentOS 6可以使用chkconfig命令) systemctl list ...

  5. 【JavaScript】原生js实现：强制保留2位小数（由于toFixed()报错）

    function decimal(x) { var f = parseFloat(x); if (isNaN(f)) { alert("请输入数字!"); return; } va ...

  6. CSS清除浮动&内容居中&文字溢出

    学习! 1.CSS清除浮动的方法 (1)添加标签清除浮动: 在浮动元素结尾处,并列的添加标签<div style="clear:both;"></div>. ...

  7. ASP.NET Core Blazor Webassembly 之 路由

    web最精妙的设计就是通过url把多个页面串联起来,并且可以互相跳转.我们开发系统的时候总是需要使用路由来实现页面间的跳转.传统的web开发主要是使用a标签或者是服务端redirect来跳转.那今天来 ...

  8. [原创][开源] SunnyUI.Net 安装

    SunnyUI.Net, 基于 C# .Net WinForm 开源控件库.工具类库.扩展类库.多页面开发框架 Blog: https://www.cnblogs.com/yhuse Gitee: h ...

  9. 朋友，您可能是MCR的受害者

    2018 年五月之后,微软将后续发布的所有 docker image 都推送到了 MCR (Miscrosoft Container Registry),但在中国大陆,它的速度实在是令人发指,本文将介 ...

  10. python2.7 函数的参数学习

    1.默认参数 默认参数可以简化函数的调用. 设置默认参数时,有几点要注意: 一.必选参数在前,默认参数在后,否则Python的解释器会报错. 二.当函数有多个参数时,把变化大的参数放前面,变化小的参数 ...