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. 【LCT+主席树】BZOJ3514 Codechef MARCH14 GERALD07加强版

    3514: Codechef MARCH14 GERALD07加强版 Time Limit: 60 Sec  Memory Limit: 256 MBSubmit: 2023  Solved: 778 ...

  2. 线上系统/tmp 目录不断增长分析与总结

    1.问题描述 系统配置为单核4G, web 工程配置堆2G,  /tmp目录 二进制文件不断增加,平均一天增加20G, 手动清理/tmp目录,重启系统,问题依旧. 2.分析 /tmp 目录存放系统运行 ...

  3. js测试地址

    很多时候,想写js测试代码,比如在学习的时候.看书敲代码,每次打开VS还是很麻烦的.特别是需要加载一些库的时候. 此时有个工具可以解决: https://jsfiddle.net/ 也是在别人的博客里 ...

  4. XOR算法的原理和实现

    XOR算法的原理和实现 XOR算法这种方法的原理 当一个数A和另一个数B进行异或运算会生成另一个数C,如果再将C和B进行异或运算则C又会还原为A. 相对于其他的简易加密算法,XOR算法的优点如下. ( ...

  5. LightOJ1012-Guilty Prince-DFS

    Guilty Prince  Time Limit: 2 second(s) Memory Limit: 32 MB Once there was a king named Akbar. He had ...

  6. HDU1097-A hard puzzle-快速幂+取模

    快速幂: 代码: kuaisumi(ll a,ll b){      ll ans=;      while(b){          ==){              ans=ans*a;     ...

  7. hdu_1573 X问题(不互素的中国剩余定理)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1573 X问题 Time Limit: 1000/1000 MS (Java/Others)    Me ...

  8. 解决指向iframe的target失效

    今天遇到一个bug. 主页面中点击左侧导航栏[某]项后,右侧的iframe页面加载到了新窗口.之后,所有选项的iframe加载都异常. 检查<a>标签target="main&q ...

  9. Java中Calendar.DAY_OF_WEEK、DAY_OF_MONTH需要减一的原因

    Java中对日期的处理需要用到Calendar类,其中有几个方法在使用时需要新手注意.1. 在获取月份时,Calendar.MONTH + 1 的原因(Java中Calendar.MONTH返回的数值 ...

  10. 【转自知乎】:localhost、127.0.0.1 和 本机IP 三者的区别?

    作者:知乎用户链接:https://www.zhihu.com/question/23940717/answer/26230963来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注 ...