`
lean1252
  • 浏览: 218361 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

js控制服务器时间的显示

阅读更多
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
<TITLE>js控制服务器时间显示</TITLE>

<script>
	var serverTime = new Date();//用于在页面显示的最终时间值
	
	function formatDate(date) {//格式化时间为"yyyy-MM-dd HH:mm:ss"
		
	return date.getYear() + "-" +
	(date.getMonth() < 9 ? "0" + (date.getMonth() + 1): date.getMonth() + 1) + "-" + (date.getDate() < 10 ? "0" + date.getDate() : date.getDate()) + " " + (date.getHours() < 10 ? "0" + date.getHours() : date.getHours()) + ":" + (date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes()) + ":" + (date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds());
	}
	
//获取服务器的时间,该方法只调用一次,客户端看到的时间都将基于些时间
	function serverCurTime() {
			
	  var srvTimeEl = document.getElementById("serverTime");  
	  var srvTimeVal;
	  if(window.navigator.userAgent.toLowerCase().indexOf("msie")>=1) {//判断浏览器类型
  		srvTimeVal = srvTimeEl.innerText;
	  } else {
  		srvTimeVal = srvTimeEl.textContent;   
      }
	  var splitTime = srvTimeVal.split(" ");
	  
	  var ymd = splitTime[0].split("-");
	  var year = ymd[0];
	  var month = ymd[1] - 1;
	  var date= ymd[2];
	   
	  var hms = splitTime[1].split(":");
	  var hour = parseInt(hms[0]);
	  var minute = parseInt(hms[1]);
	  var second = parseInt(hms[2]);
	  
	  serverTime.setYear(year);
	  serverTime.setMonth(month);
	  serverTime.setDate(date);
	  serverTime.setHours(hour);
	  serverTime.setMinutes(minute);
	  serverTime.setSeconds(second);
	  document.getElementById("curTime").innerText = formatDate(serverTime);
	 }

	 function plusOneSec() {//自动增加一秒
	 	serverTime.setSeconds(serverTime.getSeconds() + 1);
		document.getElementById("curTime").innerText = formatDate(serverTime);  	
	 }

setInterval(plusOneSec,1000);//每隔一分钟调用plusOneSec function
	</script>

</HEAD>

<BODY onload="serverCurTime();">
<!--隐藏获得的服务器时间-->
<span id="serverTime" style="display:none">2008-03-23 12:00:00</span>
<!--显示在页面的实际时间-->
<span id="curTime"></span>
</tbody>
</table>
</BODY>
</HTML>



分享到:
评论

相关推荐

    js动态显示系统当前时间

    JavaScript(简称JS)是一种轻量级的解释型编程语言,常用于网页和网络应用开发,能够操作和控制网页中的元素,实现动态效果。在本例中,我们要讨论如何使用JavaScript来动态显示客户端机器的当前时间。 JavaScript...

    js控制时间

    在JavaScript(JS)中,控制时间涉及到对日期和时间对象的操作。`Date`对象是JavaScript中的内置对象,用于处理日期和时间。在这个场景下,我们需要计算两...通过这种方式,你可以灵活地用JavaScript控制和展示时间差。

    控制title的显示时间

    根据提供的文件信息,我们可以深入分析并提取出与“控制 title 的显示时间”相关的知识点。以下是对这些知识点的详细解析: ### 1. 变量定义及其作用 在代码的开头部分,作者定义了一系列变量,用于控制提示信息...

    javascript时间显示各种特效

    当我们需要从服务器获取实时时间信息时,可以使用XMLHttpRequest或fetch API进行异步请求,获取到数据后更新页面上的时间显示。 10. **库和框架的支持**: 有许多JavaScript库,如Moment.js和date-fns,提供更...

    js时间显示代码 获取客户端的时间

    有关时间显示 js控制 轻松显示时间 获取客户端的时间 避免服务器在外地 而影响时间的错误显示

    JS+JQuery 时间控制面板

    在时间控制面板中,JavaScript 可能用于处理时间的计算和更新,例如获取当前时间,将时间转换为指定格式,以及定时刷新时间显示等任务。 jQuery 是一个 JavaScript 库,它简化了 DOM 操作、事件处理、动画和Ajax...

    js日期时间控件 JavaScriptjs日期时间控件 jsp

    JavaScript日期时间控件是网页开发中常用的一种组件,主要用于用户在网页上选择或输入日期和时间。在JavaScript中,处理日期和时间的核心对象是`Date`。本篇将深入探讨JavaScript日期时间控件的实现原理、使用方法...

    js控制时间累加.txt

    从给定的文件信息来看,该文件主要涉及的是JavaScript中时间的处理与实时更新,具体而言,是关于如何使用JS来实现时间的累加并实时显示在网页上。以下是对该知识点的详细解析: ### 核心知识点:JavaScript中的时间...

    javascript动态显示钟表

    在网页开发中,有时我们需要为用户提供实时的时间显示功能,比如动态显示当前时间的钟表。本文将详细介绍如何使用JavaScript(简称JS)来实现一个简单的动态时钟效果。该示例不仅能够实时更新时间,还能自动在小时、...

    JS时间拖动条

    5. **时间显示(Time Display)**:显示当前时间以及总时间。 6. **快进/后退按钮**:用于快速前进或后退一定时间单位。 实现这样的拖动条,我们可能需要以下步骤: 1. **HTML结构**:创建基本的HTML元素,如`...

    JAVASCRIPT控制一行显示的滚动图片

    总的来说,JavaScript控制一行显示的滚动图片涉及到HTML布局、JavaScript事件处理和CSS样式调整。理解这些基础知识是实现动态网页效果的关键。通过不断地学习和实践,你可以创建出更复杂、更吸引人的网页动态效果。

    js时间控制器或编译器

    JavaScript时间控制器和编译器是Web开发中至关重要的工具,特别是在构建交互式用户界面和处理时间数据时。本文将深入探讨这两个概念,并提供几个实际应用的例子。 首先,让我们理解JavaScript时间控制器。在...

    Bootstrap 时间控件控制只显示年,只显示年月

    在Bootstrap中,时间控件通常指的是Datepicker插件,它允许用户选择日期或者日期时间。在这个主题中,我们将深入探讨如何通过Bootstrap Datepicker来实现只显示年份或者年月的视图。 首先,为了实现这个功能,我们...

    js图片播放可以控制播放时间

    在JavaScript(JS)中,实现图片播放并控制播放时间的功能是一项常见的需求,尤其在动态展示图片、制作轮播图或幻灯片效果时。这里我们将深入探讨如何利用JS实现这一功能,并结合描述中的"adcode99"这个可能的代码库...

    js日历控制,可以方便进行控制日期的显示

    "js日历控制,可以方便进行控制日期的显示"这个标题暗示了我们将在讨论如何利用JavaScript实现一个日历功能,使得用户能轻松地查看和选择日期。在Web开发中,这种日历控件通常用于表单中的日期输入字段,提高用户...

    js网页设计的一些东西控制横向和纵向滚动条的显隐记录并显示网页的最后修改时间

    除了上述提到的控制滚动条和显示最后修改时间之外,网页设计中还涉及许多其他JavaScript技术,下面是一些常见的应用场景和技术点: #### 防止右键菜单和文本选择 - 为了保护网站内容不被轻易复制,可以禁用浏览器...

    JS_时间与时间戳

    _=`,这里的`_=`可以自动由JavaScript生成为当前时间的时间戳,这样每次请求都会附带一个不同的参数值,使得浏览器认为是新资源,从而绕过缓存加载最新文件。 3. **设置HTTP响应头**:在服务器端,可以通过设置HTTP...

    上下午显示时间控件

    4. **自定义配置**:允许开发者通过设置参数来调整时间步进(例如,每分钟一格或每5分钟一格),并可以控制AM/PM切换的显示方式。 5. **兼容性**:作为基于jQuery Mobile的插件,它应该具备良好的浏览器兼容性和跨...

    javascript经典特效---按时间不同显示图片.rar

    1. 变量声明:在JavaScript中,我们可以用`var`、`let`或`const`来声明变量,用来存储图片的URL、当前时间、切换间隔等信息。 2. 条件语句:利用`if...else`或`switch`语句,我们可以检查当前时间是否符合显示特定...

Global site tag (gtag.js) - Google Analytics