思路：

*得到当前时间

　　var date = new Date();

　　//格式化为本地时间

　　var d1 = date.toLocaleString();

*使页面每秒显示一次时间

　　setInterval()  定时器实现

*显示到页面

　　获取div标签并将时间写入

代码：

 <!DOCTYPE html>

 <html>

     <head>

         <meta charset="utf-8" />

         <title>动态显示时间</title>

         <style type="text/css">

             #times{

                 width: 200px;

                 height: 20px;

                 border: 3px solid gray;  /*如果不加实线无法显示边框*/

             }

         </style>

     </head>

     <body>

         <div id="times">

         </div>

         <script type="text/javascript">

             //得到时间并写入div

             function getDate(){

                 //获取当前时间

                 var date = new Date();

                 //格式化为本地时间格式

                 var date1 = date.toLocaleString();

                 //获取div

                 var div1 = document.getElementById("times");

                 //将时间写入div

                 div1.innerHTML = date1;

             }

             //使用定时器每秒向div写入当前时间

             setInterval("getDate()",1000);

         </script>

     </body>

 </html>

js实现动态显示时间的更多相关文章

  1. JS实现动态显示时间（最简单方法）

    使用JS实现动态显示时间 最简单实现方法 直接在网页适当的位置中插入如下js代码,(id="datetime") 不可省略. <div id="datetime&q ...

  2. Js获取当前日期时间及其它操作

    Js获取当前日期时间及其它操作var myDate = new Date();myDate.getYear(); //获取当前年份(2位)myDate.getFullYear(); //获取完整的年份 ...

  3. JS Date当前时间：获取日期时间方法在各浏览器中的差异

    转自:http://www.feiesoft.com/00047/<script type="text/javascript"> // JS Date当前时间获取方法在 ...

  4. js获取当前时间显示在页面上

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  5. Js多国时间动态更新

    Js多国时间动态更新 点击下载

  6. js生成当前时间

    js生成当前时间 var today=new Date(); function itArray(){ this.length=itArray.arguments.length for(var i=0; ...

  7. js获取当前时间&js 页面时钟

    js获取当前时间 //获取当前时间,格式YYYY-MM-DD function getNowFormatDate() { var date = new Date(); var seperator1 = ...

  8. JS获取当前日期时间及JS日期格式化

    Js获取当前日期时间: var myDate = new Date(); myDate.getYear(); //获取当前年份(2位) myDate.getFullYear(); //获取完整的年份( ...

  9. js显示当前时间

    闲着没事在闪存里看到有人需要js显示当前时间,就一时兴起写了个. 输出格式:“2013年12月18日 星期三 上午9:05:00 ”. <script type="text/javas ...

随机推荐

  1. 自己整理的的数据操作DbHelper

    using System.Data; using System.Data.SqlClient; using System.Configuration; namespace WindowsFormsAp ...

  2. 【python】Logging模块

    1.日志记录级别 logging.debug<logging.info<logging.warning<logging.error<logging.critical 关键是最高 ...

  3. django-bootstrap4|django 加载popper.min.js失败

    1.现象 2.解决过程 2.1.右键查看网页源代码 在浏览器地址栏打开popper.min.js对应的URL,发现无法打开,这个地址是国外的,需要找一个可访问的地址替换. 2.2.找到URL在djan ...

  4. 对于写Python学习笔记的看法

    学习写笔记是一个不错的学习方法,好些同学在学习Python过程中也会写学习笔记.俗话说好记性不如烂笔头,我很赞同这个说法. 我列举几个学习Python写笔记的好处: 1.Python知识的二度巩固 通 ...

  5. 踏步-java工具类

    /** * @Title:removeDuplicate * @author:踏步 * @date:2019年5月23日 下午2:31:40 * @Description:TODO 去除list的重复 ...

  6. hexo不蒜子网站访问量统计失效

    问题 hexo博客的不蒜子网站访问量统计最近失效了. 解决 原因 不蒜子域名更改了,所以需要修改博客的配置文件. 方法 进入博客目录下\themes\next\layout\_third-party\ ...

  7. JDBC上

    JDBC实战--打通数据库 代码实现: package com.imooc.db; import java.sql.Connection; import java.sql.DriverManager; ...

  8. linux基础_使用指令3

    时间日期类 1.date指令 功能:显示当前日期 语法: date:显示当前时间 date +%Y:显示当前年份 date +%m:显示当前月份 date +%d:显示当前是哪一天 date &quo ...

  9. mysql基础_操作数据库以及表

    1.数据库的操作 create database 数据库名:#一般创建方式 create database 数据库名 show databases;#查看所有数据 drop database 数据库名 ...

  10. stm32——modbus例程网址收藏

    https://blog.csdn.net/baidu_31437863/article/details/82178708 STM32(五) Modbus https://blog.csdn.net/ ...