使用js显示当前时间示例


Posted in Javascript onMarch 02, 2014

页面前台显示

<span id="clock" style="font-size:14px;"></span>

js脚本

$(document).ready(function () {
//第一种
showTime();
//第二种
var clock = new Clock();
clock.display($("#clock"));
});
//显示系统当前时间处理 第一种方法 
function showTime() {
 var myArray = new Array(7);
 var TD = new Date();
 myArray[0] = "星期日";
 myArray[1] = "星期一";
 myArray[2] = "星期二";
 myArray[3] = "星期三";
 myArray[4] = "星期四";
 myArray[5] = "星期五";
 myArray[6] = "星期六";
 weekday = TD.getDay();
 var h = TD.getHours();
 var m = TD.getMinutes();
 var s = TD.getSeconds();
 var hstr = h;
 var mstr = m;
 var istr = s;
 if (h < 10) { hstr = "0" + h };
 if (m < 10) { mstr = "0" + m };
 if (s < 10) { istr = "0" + s };
 $("#clock").innerHTML('当前时间:' + new Date().toLocaleDateString() + " " + myArray[weekday] + " " + hstr + ":" + mstr + ":" + istr);
 setTimeout(showTime, 1000);
}
//显示系统当前时间处理 第二种方法
function Clock() {
var date = new Date();
this.year=date.getFullYear();
this.month=date.getMonth()+1;
this.date=date.getDate();
this.day=newArray("星期日","星期一","星期二","星期三","星期四","星期五","星期六")[date.getDay()];
this.hour=date.getHours()<10?"0"+date.getHours():date.getHours();
this.minute=date.getMinutes()<10?"0"+date.getMinutes():date.getMinutes();
this.second=date.getSeconds()<10?"0"+date.getSeconds():date.getSeconds();
this.toString=function(){
return"现在时间是:"+this.year+"年"+this.month+"月"+this.date+"日"+this.hour+":"+this.minute+":"+this.second+""+this.day;
};
this.toSimpleDate=function(){
returnthis.year+"-"+this.month+"-"+this.date;
};
this.toDetailDate=function(){
returnthis.year+"-"+this.month+"-"+this.date+""+this.hour+":"+this.minute+":"+this.second;
};
this.display=function(ele){
varclock=newClock();
ele.innerHTML=clock.toString();
window.setTimeout(function(){clock.display(ele);},1000);
};
}
Javascript 相关文章推荐
摘自启点的main.js
Apr 20 Javascript
js Date自定义函数 延迟脚本执行
Mar 10 Javascript
自己写的兼容ie和ff的在线文本编辑器类似ewebeditor
Dec 12 Javascript
举例详解JavaScript中Promise的使用
Jun 24 Javascript
jQuery validate插件submitHandler提交导致死循环解决方法
Jan 21 Javascript
图文详解JavaScript的原型对象及原型链
Aug 02 Javascript
Vue.JS入门教程之事件监听
Dec 01 Javascript
JS常用加密编码与算法实例总结
Dec 22 Javascript
jQuery实现常见的隐藏与展示列表效果示例
Jun 04 jQuery
Vue 实现展开折叠效果的示例代码
Aug 27 Javascript
vue实现按需加载组件及异步组件功能
May 27 Javascript
Element Collapse 折叠面板的使用方法
Jul 26 Javascript
jquery实现背景墙聚光灯效果示例分享
Mar 02 #Javascript
jquery制作弹窗提示窗口代码分享
Mar 02 #Javascript
jquery中ajax函数执行顺序问题之如何设置同步
Feb 28 #Javascript
JavaScript获取当前页面上的指定对象示例代码
Feb 28 #Javascript
jquery获取当前点击对象的value方法
Feb 28 #Javascript
经过绑定元素时会多次触发mouseover和mouseout事件
Feb 28 #Javascript
判断某个字符在一个字符串中是否存在的js代码
Feb 28 #Javascript
You might like
php函数传值的引用传递注意事项分析
2016/06/25 PHP
JavaScript 提升运行速度之循环篇 译文
2009/08/15 Javascript
基于jquery的滚动新闻列表
2010/06/19 Javascript
jquery 插件学习(六)
2012/08/06 Javascript
jquery+正则实现统一的表单验证
2015/09/20 Javascript
深入探究AngularJS框架中Scope对象的超级教程
2016/01/04 Javascript
js和jQuery设置Opacity半透明 兼容IE6
2016/05/24 Javascript
js两种拼接字符串的简单方法(必看)
2016/09/02 Javascript
微信js-sdk分享功能接口常用逻辑封装示例
2016/10/13 Javascript
JQuery 动态生成Table表格实例代码
2016/12/02 Javascript
jquery操作ID带有变量的节点实例
2016/12/07 Javascript
详解vue父子组件间传值(props)
2017/06/29 Javascript
详解使用Vue Router导航钩子与Vuex来实现后退状态保存
2017/09/11 Javascript
详解js跨域请求的两种方式,支持post请求
2018/05/05 Javascript
angular 实时监听input框value值的变化触发函数方法
2018/08/31 Javascript
nodejs高大上的部署方式(PM2)
2018/09/11 NodeJs
微信小程序访问豆瓣电影api的实现方法
2019/03/31 Javascript
新手如何快速理解js异步编程
2019/06/24 Javascript
在vue中利用v-html按分号将文本换行的例子
2019/11/14 Javascript
vue实现tab栏点击高亮效果
2020/08/19 Javascript
[27:02]2014 DOTA2国际邀请赛中国区预选赛 5 23 CIS VS LGD第三场
2014/05/24 DOTA
[51:20]完美世界DOTA2联赛PWL S2 Magma vs PXG 第一场 11.28
2020/12/01 DOTA
Python urlopen 使用小示例
2008/09/06 Python
python读取和保存图片5种方法对比
2018/09/12 Python
详解Python3之数据指纹MD5校验与对比
2019/06/11 Python
Python实现的微信红包提醒功能示例
2019/08/22 Python
pytorch 指定gpu训练与多gpu并行训练示例
2019/12/31 Python
基于Numba提高python运行效率过程解析
2020/03/02 Python
Django自定义全局403、404、500错误页面的示例代码
2020/03/08 Python
Python3.7安装pyaudio教程解析
2020/07/24 Python
报社实习生自荐信
2014/01/24 职场文书
心理学专业大学生职业生涯规划范文
2014/02/19 职场文书
《美丽的田园》教学反思
2014/03/01 职场文书
总账会计岗位职责
2014/03/13 职场文书
高中课前三分钟演讲稿
2014/08/18 职场文书
社区干部培训心得体会
2016/01/06 职场文书