1、HTML部分

<div id="div1">显示当前时间!</div>

2、css部分

#div1 {
width: 700px;
height: 50px;
border: 1px solid #000;
margin: 100px auto;
text-align: center;
font-size: 20px;
line-height: 50px;
}

3、JavaScript部分

function showTime(){
var d = new Date();
var year = d.getFullYear();
var month = d.getMonth() + 1;//0~11
var date = d.getDate(); var week = d.getDate();//0~6 0是周末 week = numOfChinese(week); var hour = doubleNum(d.getHours());
var min = doubleNum(d.getMinutes());
var sec = doubleNum(d.getSeconds()); var str = year + "年" + month + "月" + date + "日 星期" + week + " " + hour + ":" + min + ":" + sec;
return str;
} setInterval(function(){
var timer = document.getElementById("div1");
timer.innerHTML = showTime();
},1000);

JavaScript实时显示当前时间的更多相关文章

  1. JavaScript实时显示当前时间的例子

    用javascript代码在当前页面中实时显示当前时间.代码如下: <html> <head> <title>JavaScript 实时显示当前时间-www.jbx ...

  2. Vue页面上实时显示当前时间,每秒更新

    有时候我们需要在页面上添加一个类似时钟的东西来实时显示当前时间,这个时候我们可以利用定时器来完成这个功能 <div id="app"> {{date}} </di ...

  3. Qt 实时显示系统时间

    前言 我们用一个label控件来实时显示系统时间,用到 QTimer 和 QDateTime 这个两个类. 正题 头文件: #ifndef MAINWINDOW_H #define MAINWINDO ...

  4. vue实时显示当前时间且转化为“yyyy-MM-dd hh:mm:ss”格式

    在实际运用中时间格式"yyyy-MM-dd hh:mm:ss"用的最多,如果需要其他格式可根据需求自行修改,下面直接上代码: 引入相应的js即可运行 <!DOCTYPE ht ...

  5. Android学习总结——实时显示系统时间

    我们都知道System.currentTimeMillis()可以获取系统当前的时间,这里要实时显示就可以开启一个线程,然后通过handler发消息,来实时的更新TextView上显示的系统时间.具体 ...

  6. Javascript 客户端实时显示服务器时间

    <!doctype html> <html lang="zh-cn"> <head> <meta charset="utf-8& ...

  7. js实时显示系统时间

    刚刚在做后台页面最上面要动态显示时间刚写了这个代码 将这段代码加入<head></head> <!--时间显示代码 --><script>functio ...

  8. 用JS实现实时显示系统时间

    废话我就不多说了,直接上图和代码了 效果图: 代码视图: 下面为大家附上代码,复制即可用: <!DOCTYPE html> <html lang="en"> ...

  9. php随笔6-thinkphp OA系统 JS 实时显示当前时间

    不多说,直入主题: JS. // JavaScript Document function showtime() { var today,hour,second,minute,year,month,d ...

随机推荐

  1. [易霖博YCTF]Web WriteUp

    中午队里师傅发到群里的比赛,借来队里师傅账号和队里其他师傅一起做了一下,ak了web,师傅们tql.学到挺多东西,总结一下. rce_nopar 进入题目给出源码: <?php if(isset ...

  2. Windows下安装nvm管理多个nodejs版本

    平常在工作中难免会有node版本的要求,下面介绍一种利用nvm工具管理多个node版本的方法 下载安装 Github: Download nvm-windows --- nvm-setup.zip 程 ...

  3. myeclipse前端界面乱码

    框起来的值默认的格式是ISO-8859-1,改为UTF-8

  4. BIO应用-RPC框架

    为什么要有RPC?  我们最开始开发的时候,一个应用一台机器,将所有功能都写在一起,比如说比较常见的电商场景. 随着我们业务的发展,我们需要提示性能了,我们会怎么做?将不同的业务功能放到线程里来实现异 ...

  5. 【Flutter 实战】1.20版本更新及新增组件

    老孟导读:Flutter 1.20 更新了 Slider.RangeSlider.日期选择器组件.时间选择器组件的样式,新增了交换组件:InteractiveViewer,下面详细介绍其用法. 滑块 ...

  6. 开始使用 TypeScript 和 React

    原文地址:Getting started with TypeScript and React 原文作者:Jack_Franklin 译者:luxj 校对者:veizz Tom Dale 和其他人有一些 ...

  7. 抓包工具Burp Suite安装步骤(待补充)

    Burp Suite V2.1(破解版)安装步骤:(可以自行下载破解版或汉化版) 百度网盘下载地址: 链接:https://pan.baidu.com/s/1bU5JME3OsEsXrSirTdesR ...

  8. ASP.NET Core 3.x启动时运行异步任务(一)

    这是一个大的题目,需要用几篇文章来说清楚.这是第一篇.   一.前言 在我们的项目中,有时候我们需要在应用程序启动前执行一些一次性的逻辑.比方说:验证配置的正确性.填充缓存.或者运行数据库清理/迁移等 ...

  9. 被喷了!聊聊我开源的RPC框架那些事

    前段时间利用业余时间写了一个简单的 RPC 框架,花费了不少精力.开源出来之后,少部分不太友好的技术人站在上帝视角说了风凉话.就很难受,兄弟,谁还没有一个玻璃心. 简单吐槽一波,给大家聊聊关于 gui ...

  10. (数据科学学习手札95)elyra——jupyter lab平台最强插件集

    本文示例文件已上传至我的Github仓库https://github.com/CNFeffery/DataScienceStudyNotes 1 简介 jupyter lab是我最喜欢的编辑器,在过往 ...