效果图:

具体代码

  js代码

<script type="text/javascript">
var t = null;
t = setTimeout(time,1000);//開始运行
function time()
{
clearTimeout(t);//清除定时器
dt = new Date();
var y=dt.getFullYear();//获取年
var m=dt.getMonth();//获取月
var d=dt.getDate();//获取日
var h=dt.getHours();//获取时
var f=dt.getMinutes();//获取分
var s=dt.getSeconds();//获取秒
document.getElementById("showTime").innerHTML = "本次作业完成距离现在:<span style='color: darkred;'>"+y+"年"+(m+1)+"月"+d+"日"+h+"时"+f+"分"+s+"秒 </span>";
t = setTimeout(time,1000); //设定定时器,循环运行
} </script>

  

  html代码

<span id="showTime"></span>

  

实现的依据

  主要是依靠这个定时器让js一直在运行,实现动态的效果!就像轮播图一样。采用的是js轮循!

说明

转载请注明出处!谢谢配合

js页面动态时间展示的更多相关文章

  1. js 实现动态时间

    <span id="timebox"></span>                   //承载时间的span $(function () { var o ...

  2. 纯JS实现动态时间

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

  3. JAVAEE——宜立方商城09:Activemq整合spring的应用场景、添加商品同步索引库、商品详情页面动态展示与使用缓存

    1. 学习计划 1.Activemq整合spring的应用场景 2.添加商品同步索引库 3.商品详情页面动态展示 4.展示详情页面使用缓存 2. Activemq整合spring 2.1. 使用方法 ...

  4. Js多国时间动态更新

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

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

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

  6. [JS前端开发] js/jquery控制页面动态加载数据 滑动滚动条自动加载事件

    页面滚动动态加载数据,页面下拉自动加载内容 相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多 有手机的相信都见过这样的效果:进入qq空间,向下拉动空 ...

  7. js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的

    js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的 相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多 有手机的相信都见过这样 ...

  8. 页面显示时间js

    //页面显示时间 <span align="left" id="OperatorTime"> </span> <script> ...

  9. JS+Ajax+Servlet:记录页面访问时间

    1.前端JS记录页面访问时间 1.1JQuery版本: <script type="text/javascript" src="js/jquery.min.js&q ...

随机推荐

  1. curl 抓取页面信息

    <?php // 1. 初始化 $ch = curl_init(); // 2. 设置选项,包括URL curl_setopt($ch, CURLOPT_URL, "www" ...

  2. BZOJ1259:[CQOI2007]矩形rect(DFS)

    Description 给一个a*b矩形,由a*b个单位正方形组成.你需要沿着网格线把它分成分空的两部分,每部分所有格子连通,且至少有一个格子在原矩形的边界上.“连通”是指任两个格子都可以通过水平或者 ...

  3. 【LGP5162】WD与积木

    题目 场面过度玄学,容易引起不适 我们发现我们要求的这个期望由分母和分子两部分构成 易发现 \[Ans=\frac{\sum_{i=1}^nS_2(n,i)\times i\times i!}{\su ...

  4. Django视图(一)

    Django视图(一) 一. 概述 作用:视图接受web请求,并相应请求 本质:视图是自定义的一个python中的函数 响应内容:正常视图,重定向视图,错误视图(404,500,400) 响应过程: ...

  5. Kali-linux物理访问攻击

    物理访问攻击与提升用户的权限类似.即当一个普通用户登录到系统中,破解本地其他用户账户的密码.在Linux中,普通用户可以通过su命令代替其他用户执行某些操作,意味着该用户能够在Linux/Unix系统 ...

  6. 发送邮件 html格式

    下面黄色代码为实现发送邮件 FileStream fs = new FileStream(Server.MapPath("../ImportUserIOExcel/productConsul ...

  7. PAT——1030. 完美数列

    给定一个正整数数列,和正整数p,设这个数列中的最大值是M,最小值是m,如果M <= m * p,则称这个数列是完美数列. 现在给定参数p和一些正整数,请你从中选择尽可能多的数构成一个完美数列. ...

  8. poj 2253 Frogger 最小瓶颈路(变形的最小生成树 prim算法解决(需要很好的理解prim))

    传送门: http://poj.org/problem?id=2253 Frogger Time Limit: 1000MS   Memory Limit: 65536K Total Submissi ...

  9. 双显示器N卡安装ubuntu驱动以及解决办法

    之前我是打算在win下面结合虚拟机开发前后端,今天仔细想了一下,不是很靠谱,后端调试太困难了.可能的方案就是Netbeans远程开发的方式,以前我试过,调试起来也是非常的麻烦.于是果断下载个ubunt ...

  10. SPOJ 4487. Can you answer these queries VI splay

    题目链接:点击打开链接 题意比較明显,不赘述. 删除时能够把i-1转到根,把i+1转到根下 则i点就在 根右子树 的左子树,且仅仅有i这一个 点 #include<stdio.h> #in ...