HTML部分:

     <div class="div">
<div id="div"> </div>
</div>

  CSS样式部分:

*{margin:; padding:;}
.div{width:100%;height:636px;background: linear-gradient(to top, #333 0%, #fff 100%);}
#div{box-sizing: border-box;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-100%);font-family: STXingkai;font-size: 50PX;}

  JS部分:

         function biao(){
var div = document.getElementById("div");
var dt = new Date(); //获取当前系统时间
var year = dt.getFullYear(); //获取年
var month = dt.getMonth()+1; //获取月
var ri = dt.getUTCDate();   //获取日
var hours = dt.getHours();  //获取时
var min = dt.getMinutes();  //获取分
var sec = dt.getSeconds();  //获取秒
var day = dt.getDay();    //获取星期几,返回的是数字,不是一二三这种中文,
var arr = ["一","二","三","四","五","六","日"] //将星期返回的数字转换成中文的一二三四
div.innerHTML=year+"年"+month+"月"+ri+"日"+hours+"时"+"<br />"+min+"分"+sec+"秒"+"星期:"+arr[day-1];
}
setInterval("biao()",1000); //setInterval定时器:第一个值为biao()这个方法,第二个值为多少秒执行一次。

最终效果:

  

  

JS动态获取当前时间的更多相关文章

  1. Titanium系列--利用js动态获取当前时间

    动态获取时间: //显示时间 function getDateTime() { var now = new Date(); var year = now.getFullYear(); var mont ...

  2. js动态获取当前时间(年、月、日、上午/下午、时、分、秒)

    //获取动态时间function mytime() { var mydate = new Date(); var year = mydate.getFullYear(); var month = my ...

  3. Js动态获取iframe子页面的高度////////////////////////zzzz

    Js动态获取iframe子页面的高度   Js动态获取iframe子页面的高度总结 问题的缘由 产品有个评论列表引用的是个iframe,高度不固定于是引发这个总结. 方法1:父级页面获取子级页面的高度 ...

  4. js实现获取当前时间是本月第几周和年的第几周的方法

    js实现获取当前时间是本月第几周和年的第几周的方法 获取本月第几周的方法: var getMonthWeek = function (a, b, c) { /** * a = d = 当前日期 * b ...

  5. js动态获取浏览器或页面等容器的宽高

    首先说一下js动态获取浏览器或页面等容器的宽高的方法大体有哪些: 网页可见区域宽: document.body.clientWidth 网页可见区域高: document.body.clientHei ...

  6. js实现获取当前时间是本月第几周的方法

    这篇文章主要介绍了js实现获取当前时间是本月第几周的方法,涉及javascript针对日期及时间的相关操作技巧,非常简单实用,需要的朋友可以参考下. 本文实例讲述了js实现获取当前时间是本月第几周的方 ...

  7. JS简单获取当前日期时间的方法(yyyy-MM-dd hh:mm:ss)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xht ...

  8. jsp页面动态获取系统时间

    最近在做练习时碰到了这样一个问题:"读者选择查询图书相应信息,跳转到书目的详细信息界面,当可借阅数量大于零,点击借阅按钮,提示用户借阅成功,并显示归还日期(三个月),否则提示用户该书可借阅数 ...

  9. js动态获取子复选项并设计全选及提交

    在做项目的时候,会遇到根据父选项,动态的获取子选项,并列出多个复选框,提交时,把选中的合并成一个字符提交后台 本章将讲述如何通过js控制实现该操作: 1:设计父类别为radio,为每一个radio都加 ...

随机推荐

  1. poi 读取word文档

    1.导入jar包 官网下载地址: https://www.apache.org/dyn/closer.lua/poi/release/bin/poi-bin-3.17-20170915.zip 最开始 ...

  2. 一个InnoDB性能超过Oracle的调优Case

    年前抽空到兄弟公司支援了一下Oracle迁移MySQL的测试,本想把MySQL调优到接近Oracle的性能即可,但经过 @何_登成 @淘宝丁奇 @淘宝褚霸 @淘伯松 诸位大牛的指导和帮助(排名不分先后 ...

  3. Python全栈考试(一)

    1.执行 Python 脚本的两种方式 1) 使用命令行执行Python脚本: python C:\tesst.py 2) 使用各种IDE软件.pycharm wing 2.简述位.字节的关系 位 ( ...

  4. 【CentOS】阿里云ECS申请CA证书配置SSL

    本文记录阿里云ECS申请CA证书流程先到阿里云控制台找到CA证书服务,这里两台ECS都已经申请签发了证书,如果是还没申请的就在"状态"中点击补全: 进去后填写完个人信息后,这里选择 ...

  5. Android开发艺术探究Note

    第一章:Activity的生命周期和启动模式 生命周期 onPause表示activity正在停止,onPaus必须先执行完(栈顶的activity),新的activity的onResume才会执行. ...

  6. Vue入门

    一.引入vue 方法一:下载vue.js,然后像引用jquery一样,在HTML中使用script标签引入 <script src="https://unpkg.com/vue/dis ...

  7. html笔记4

    <html> <body> <p>这是列表标签</p> <ul> <li>xxx</li> </ul> ...

  8. UESTC 1584 Washi与Sonochi的约定【树状数组裸题+排序】

    题目链接:UESTC 1584 Washi与Sonochi的约定 题意:在二维平面上,某个点的ranked被定义为x坐标不大于其x坐标,且y坐标不大于其y坐标的怪物的数量.(不含其自身),要求输出n行 ...

  9. BZOJ 1192: [HNOI2006]鬼谷子的钱袋(新生必做的水题)

    1192: [HNOI2006]鬼谷子的钱袋 Time Limit: 10 Sec  Memory Limit: 162 MBSubmit: 3557  Solved: 2596[Submit][St ...

  10. 水dp第二天(背包有关)

    水dp第二天(背包有关) 标签: dp poj_3624 题意:裸的01背包 注意:这种题要注意两个问题,一个是要看清楚数组要开的范围大小,然后考虑需要空间优化吗,还有事用int还是long long ...