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

JS实现动态显示当前时间(12/24小时制)

阅读更多
今天又要用到动态显示当前时间,且要求可以切换24/12小时制, 记得很久前写过一个24小时制的,但一时没能找着, 于是又重新写了个,若有需要的朋友自行复制粘贴一份吧.
很简单的一个功能函数,实现方式不多言,用Date()对象获取到当前时间,然后用setTimeout每隔1秒获取最新的时间.
写的过程中碰到过一个小小的问题: 我最初的想法是用setInterval()每隔1秒获取最新时间,可是可以,但setInterval如果放在主函数内部,但导致内存泄漏(至于原因,暂时还没想明白),后来在Rocky的提醒下用setTimeout()才解决内存泄漏问题,感谢Rocky同学:)
function nowTime(ev,type){
	/*
	 * ev:显示时间的元素
	 * type:时间显示模式.若传入12则为12小时制,不传入则为24小时制
	 */
	//年月日时分秒
	var Y,M,D,W,H,I,S;
	//月日时分秒为单位时前面补零
	function fillZero(v){
		if(v<10){v='0'+v;}
		return v;
	}
	(function(){
		var d=new Date();
		var Week=['星期天','星期一','星期二','星期三','星期四','星期五','星期六'];
		Y=d.getFullYear();
		M=fillZero(d.getMonth()+1);
		D=fillZero(d.getDate());
		W=Week[d.getDay()];
		H=fillZero(d.getHours());
		I=fillZero(d.getMinutes());
		S=fillZero(d.getSeconds());
		//12小时制显示模式
		if(type && type==12){
			//若要显示更多时间类型诸如中午凌晨可在下面添加判断
			if(H<=12){
				H='上午 '+H;
			}else if(H>12 && H<24){
				H-=12;
				H='下午 '+fillZero(H);
			}else if(H==24){
				H='下午 00';
			}
		}
		ev.innerHTML=Y+'年'+M+'月'+D+'日 '+' '+W+' '+H+':'+I+':'+S;
		//每秒更新时间
		setTimeout(arguments.callee,1000);
	})();
}
分享到:
评论

相关推荐

    javascript 在html上动态显示时间

    在HTML页面动态显示当前时间,效果如下: 现在是:2011年7月6日 20:02:50

    js动态实现美观的时钟展示显示

    最后,为了让时钟更具互动性,可以添加用户控制功能,比如切换24小时制和12小时制,或者改变时钟的外观主题。这可以通过监听用户的事件(如点击按钮)并相应地调整代码实现。 总结,创建一个动态美观的时钟展示需要...

    javascript动态显示钟表

    - 可以根据用户所在地区调整时间格式(例如12小时制与24小时制),以及支持不同的语言环境。 - **美化样式:** - 可以使用CSS对时间显示进行样式美化,增加视觉吸引力。 通过以上分析可以看出,使用JavaScript...

    js显示当前时间、时间

    在JavaScript中,获取和显示当前系统日期和时间是常见的需求,这对于创建实时更新的时钟或者记录时间戳等场景非常有用。下面我们将深入探讨如何在JavaScript中实现这一功能。 首先,JavaScript提供了一个内置的`...

    html+css+js 网页上动态显示时间XX:XX:XX

    在网页设计中,动态显示时间是一项基础但实用的功能,它能实时更新页面上的时间,给用户提供即时的时间信息。本教程将详细介绍如何使用HTML、CSS和JavaScript这三个核心技术来创建一个简单的网页,动态显示时间"XX:...

    js在线当前时间和日期

    在JavaScript(JS)中,获取和处理当前日期与时间是一项常见的任务。JavaScript提供了一系列内置对象和方法,使得开发者能够方便地获取实时的日期和时间信息,以及进行各种日期时间操作。下面我们将详细讨论如何在...

    js即时显示时间代码

    // 将24小时制转换为12小时制,凌晨0点显示为12小时 var currentTime = year + "年" + month + "月" + day + "日 " + hour + ":" + minute + ":" + second + " " + amOrPm; // 组合成完整时间字符串 document....

    JS实现获取当前时间和倒计时功能

    在实际应用中,我们通常会将这些JavaScript代码与HTML结合,动态地在页面上显示当前时间和倒计时。例如,我们可以创建一个`time.html`文件,包含以下内容: ```html &lt;!DOCTYPE html&gt; &lt;title&gt;JS获取当前时间与...

    JavaScript实现当前时间

    要获取24小时制的当前时间,我们可以这样做: ```javascript var hours = now.getHours(); var minutes = now.getMinutes(); var seconds = now.getSeconds(); ``` 由于这些方法可能返回0-9之间的数字,我们需要在...

    手机端移动网页js实现弹窗一个ip在24小时只弹出一次的代码

    总结起来,通过JavaScript和cookie技术,我们可以实现一个手机端网页的弹窗功能,使得同一IP地址在24小时内只会弹出一次。这个方法不仅可以提升用户体验,也可以更有效地利用有限的广告资源。在实际应用中,还可以...

    javascript现实显示系统当前时间

    - 格式化时间,包括年月日以及小时分钟秒,并支持12小时制与24小时制切换。 - 将格式化后的时间写入页面中的`Clock`元素。 - 使用`setTimeout`每秒钟调用一次`tick()`函数,实现时间的实时更新。 ### 2. 文本框点击...

    js获取当前时间

    在JS中获取当前时间是一项基本操作,对于创建动态网页或者实现时间相关的功能至关重要。 在JavaScript中,获取当前日期和时间主要通过`Date`对象来完成。`Date`对象提供了多种方法来创建、操作和格式化日期和时间。...

    javascript经典特效---二十四小时时钟2.rar

    JavaScript经典特效——二十四小时时钟2是一个典型的网页交互设计,主要利用了JavaScript语言来实现一个实时更新的24小时制时钟。这个效果通常用于网页的头部或者底部,为用户提供当前时间信息,增强用户体验。 ...

    js做的显示当前时间

    在网页上显示当前时间的功能是JavaScript的基本应用之一。本篇将深入探讨如何利用JavaScript实现这一功能。 首先,我们需要理解JavaScript中的日期对象(Date Object)。这是JavaScript内置的一种数据类型,用于...

    JS获取当前时间并格式化"yyyy-MM-dd HH:mm:ss"

    在JavaScript中,获取和格式化当前时间是一项常见的任务,尤其在网页开发中,我们经常需要显示或处理日期和时间信息。下面将详细讲解如何利用JavaScript的内置Date对象以及自定义扩展来实现这一功能。 首先,我们...

    js显示当前日期

    本文将根据提供的代码片段,详细介绍如何利用JavaScript实现动态显示当前日期的功能,并对代码进行逐行分析。 #### 一、JavaScript日期对象 在JavaScript中,可以通过`Date`对象来处理日期和时间。创建一个`Date`...

    用js实现页面显示当前日期和时间的代码

    ### 使用JavaScript实现在网页上显示当前日期和时间 在现代Web开发中,JavaScript是一种非常重要的客户端脚本语言,被广泛用于动态网站的构建。通过JavaScript,我们可以轻松地为用户提供更加丰富的交互体验。其中...

    jquery自定义当前动态时间样式

    我们定义了一个`updateTime`函数,用于获取当前时间并格式化为24小时制。然后将其设置到`#current-time`元素中。最后,使用`setInterval`方法每秒调用一次`updateTime`,实现时间的实时更新。 这个例子展示了如何...

    动态系统时间 js

    总结来说,“动态系统时间 js”是指使用JavaScript实现网页上的实时时间显示,通常涉及到`Date`对象的使用,以及定期更新HTML元素来显示当前时间。开发者可能通过浏览器的开发者工具进行调试和优化,以确保时钟功能...

    javascript经典特效---二十四小时时钟.rar

    这个特效能够显示当前时间,以24小时制的形式,增强用户界面的实时性和互动性。 在JavaScript中,获取当前时间主要通过`Date`对象来完成。创建一个新的`Date`对象会返回当前日期和时间。我们可以使用`Date`对象的...

Global site tag (gtag.js) - Google Analytics