JS控制日期显示的小例子


Posted in Javascript onNovember 23, 2013

我们在项目中一般会遇到显示时间的问题,一般的处理方式是在前台通过JS控制,JS控制显示时间的代码如下,各种不同的显示方式:

function Clock() {
 var date = new Date();
 this.year = date.getFullYear();
 this.month = date.getMonth() + 1;
 this.date = date.getDate();
 this.day = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六")[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; 
 };//现在是<SPAN id=clock>现在是:2013年3月6日 13:54:17 星期三</SPAN>
<SPAN></SPAN>
 this.toSimpleDate = function() {
  return this.year + "-" + this.month + "-" + this.date;
 };//2013-03-06 this.toDetailDate = function() {
  return this.year + "-" + this.month + "-" + this.date + " " + this.hour + ":" + this.minute + ":" + this.second;
 };//2013-03-06 13:45:43
 this.display = function(ele) {
  var clock = new Clock();
  ele.innerHTML = clock.toString();//显示方式调用
  window.setTimeout(function() {clock.display(ele);}, 1000);
 };
}
Javascript 相关文章推荐
解密效果
Jun 23 Javascript
javascript支持firefox,ie7页面布局拖拽效果代码
Dec 20 Javascript
jQuery ui 1.7更新小结
Aug 15 Javascript
js或css文件后面跟参数的原因说明
Jan 09 Javascript
javascript中强制执行toString()具体实现
Apr 27 Javascript
JavaScript设计模式之适配器模式介绍
Dec 28 Javascript
angularJS 中$scope方法使用指南
Feb 09 Javascript
Node.js 异步编程之 Callback介绍(一)
Mar 30 Javascript
vue2.0中goods选购栏滚动算法的实现代码
May 17 Javascript
Vue中添加手机验证码组件功能操作方法
Dec 07 Javascript
JS实现用特殊符号替换字符串的中间部分区域的实例代码
Jul 24 Javascript
Web安全之XSS攻击与防御小结
Dec 13 Javascript
Jquery 动态循环输出表格具体方法
Nov 23 #Javascript
基于jquery异步传输json数据格式实例代码
Nov 23 #Javascript
JavaScript Ajax Json实现上下级下拉框联动效果实例代码
Nov 23 #Javascript
javascript阻止浏览器后退事件防止误操作清空表单
Nov 22 #Javascript
js获取电脑分辨率的思路及操作
Nov 22 #Javascript
JS+CSS 制作的超级简单的下拉菜单附图
Nov 22 #Javascript
Mac/Windows下如何安装Node.js
Nov 22 #Javascript
You might like
php 中include()与require()的对比
2006/10/09 PHP
PHP实现的函数重载功能示例
2018/08/03 PHP
用 javascript 实现的点击复制代码
2007/03/24 Javascript
Prototype Number对象 学习
2009/07/19 Javascript
Jquery知识点三 jquery表单对象操作
2011/01/17 Javascript
JS判断当前日期是否大于某个日期的实现代码
2012/09/02 Javascript
原生js拖拽(第一课 未兼容)拖拽思路
2013/03/29 Javascript
JS实现匀速运动的代码实例
2013/11/29 Javascript
以JSON形式将JS中Array对象数组传至后台的方法
2014/01/06 Javascript
javascript实现2048游戏示例
2014/05/04 Javascript
chrome下判断点击input上标签还是其余标签的实现方法
2016/09/18 Javascript
bootstrap选项卡使用方法解析
2017/01/11 Javascript
用原生js做单页应用
2017/01/17 Javascript
jQuery使用DataTable实现删除数据后重新加载功能
2017/02/27 Javascript
three.js中文文档学习之创建场景
2017/11/20 Javascript
Vue登录注册并保持登录状态的方法
2018/08/17 Javascript
在Vue组件中获取全局的点击事件方法
2018/09/06 Javascript
JavaScript如何实现元素全排列实例代码
2019/05/14 Javascript
15分钟上手vue3.0(小结)
2020/05/20 Javascript
Vue左滑组件slider使用详解
2020/08/21 Javascript
[01:02:32]DOTA2-DPC中国联赛 正赛 iG vs PSG.LGD BO3 第二场 2月26日
2021/03/11 DOTA
Python不规范的日期字符串处理类
2014/06/10 Python
在Python的Django框架中获取单个对象数据的简单方法
2015/07/17 Python
pandas 获取季度,月度,年度首尾日期的方法
2018/04/11 Python
Python SQLAlchemy库的使用方法
2020/10/13 Python
python使用yaml 管理selenium元素的示例
2020/12/01 Python
HTML5的download属性详细介绍和使用实例
2014/04/23 HTML / CSS
中文师范生自荐信
2014/01/30 职场文书
幼儿园亲子活动总结
2014/04/26 职场文书
小学家长学校培训材料
2014/08/24 职场文书
人事代理委托书
2014/09/27 职场文书
户籍证明模板
2014/09/28 职场文书
大学生迟到检讨书500字
2014/10/17 职场文书
2015年感恩父亲节活动策划方案
2015/05/05 职场文书
JavaScript 事件捕获冒泡与捕获详情
2021/11/11 Javascript
Nginx配置根据url参数重定向
2022/04/11 Servers