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. "软件随想录" 读书笔记

    人员管理: 三种方法: 军事化管理方法, 经济利益驱动法, 认同法. 军事化管理方法不行. 经济利益驱动法也不行. 认同法, 其中一条建议是一起干活的人一起吃饭. 但这种做法比较困难. 设计的作用 寸 ...

  2. Django—模板渲染

    参考文档: http://www.cnblogs.com/fnng/p/4373108.html https://code.ziqiangxuetang.com/django/django-intro ...

  3. 企业信息化快速开发平台--JeeSite

    JeeSite是在Spring Framework基础上搭建的一个Java基础开发平台,以Spring MVC为模型视图控制器,MyBatis为数据访问层, Apache Shiro为权限授权层,Eh ...

  4. UML建模之时序图(Sequence Diagram)

    一.时序图简介(Brief introduction) 二.时序图元素(Sequence Diagram Elements) 角色(Actor) 对象(Object) 生命线(Lifeline) 控制 ...

  5. 洛谷 P3377 【模板】左偏树(可并堆)

    洛谷 P3377 [模板]左偏树(可并堆) 题目描述 如题,一开始有N个小根堆,每个堆包含且仅包含一个数.接下来需要支持两种操作: 操作1: 1 x y 将第x个数和第y个数所在的小根堆合并(若第x或 ...

  6. JavaSE(八)之集合练习一

    前面把Collection家族给学习完毕了,接下来我们通过几个练习来巩固前面的知识. 一.产生10个1-20之间的随机数要求随机数不能重复 import java.util.HashSet; impo ...

  7. 如何让一个DIV水平,垂直方向都居中于浏览器?

    <style type="text/css"><!-- div {position:absolute;top:50%;left:50%;margin:-150px ...

  8. 51 Nod 1119

    机器人走方格 V2 M * N的方格,一个机器人从左上走到右下,只能向右或向下走.有多少种不同的走法?由于方法数量可能很大,只需要输出Mod 10^9 + 7的结果. Input 第1行,2个数M,N ...

  9. Slim Span(Kruskal)

    题目链接:http://poj.org/problem?id=3522   Slim Span Time Limit: 5000MS   Memory Limit: 65536K Total Subm ...

  10. Replacement(思维题)

    题目链接:http://codeforces.com/problemset/problem/570/C C. Replacement time limit per test 2 seconds mem ...