JS-效能合集-电子时钟（eclock）
日期：2014-05-16 浏览次数：20383 次
JS--功能合集--电子时钟（eclock）
利用小周末,学学整整JS,越来越感觉WEB开发中JS是多么重要了,与用户的交互是使用者评价项目好坏的很重要的标准,因此javascript在这里举足轻重,因为是初学者,所以有不足的地方还要大家多多指教,相互学习哈~
JS-功能合集-电子时钟(eclock)
----------------------js文件-------------------
/**
* 获得系统当前时间方法-eclock-简单实现
* @param clock
*/
function getEClock(clock){
var date=new Date();
var year=date.getFullYear();//年-4位表示 如：2012
var month=date.getMonth()+1;//月 0~11 所以要加 1才正确
var day=date.getDate();//日 1~31
var week=date.getDay();//星期 0~6
var weeks=new Array("星期日","星期一","星期二","星期三","星期四","星期五","星期六");//自己写的数组,为了匹配中文的星期
var xq=weeks[week];//星期
var hour=date.getHours();//小时0~23
var min=date.getMinutes();//分钟0~59
var sec=date.getSeconds();//秒 0~59
var datetime=year+"年"+month+"月"+day+"日"+" "+xq+" "+hour+"时"+min+"分"+sec+"秒";//拼接一起,当然可以直接在这里修改显示格式
clock.innerHTML="<font>当前系统是 : "+datetime+"</font>";//以html文本形式显示在页面上
}
window.onload=function(){//window 对象调用onload在页面加载时执行该匿名函数
var timer=window.setInterval("getEClock(clock)", 1000);//setInterval("A()",B)每隔多少时间执行一次A方法
}
----------------------部分jsp文件------------------
<head>
<script language="javascript" src="js/getEClock.js"></script>
</head>
<body>
<div id="clock"></div><!--在此显示电子时钟-->
</body>
注：没有写样式css文件,这个到实际应用是根据不同需求再写就行了......
这显然是个小例子,也是个小开始,会在以后陆续,整理更多、更常用的小功能的.
利用小周末,学学整整JS,越来越感觉WEB开发中JS是多么重要了,与用户的交互是使用者评价项目好坏的很重要的标准,因此javascript在这里举足轻重,因为是初学者,所以有不足的地方还要大家多多指教,相互学习哈~
JS-功能合集-电子时钟(eclock)
----------------------js文件-------------------
/**
* 获得系统当前时间方法-eclock-简单实现
* @param clock
*/
function getEClock(clock){
var date=new Date();
var year=date.getFullYear();//年-4位表示 如：2012
var month=date.getMonth()+1;//月 0~11 所以要加 1才正确
var day=date.getDate();//日 1~31
var week=date.getDay();//星期 0~6
var weeks=new Array("星期日","星期一","星期二","星期三","星期四","星期五","星期六");//自己写的数组,为了匹配中文的星期
var xq=weeks[week];//星期
var hour=date.getHours();//小时0~23
var min=date.getMinutes();//分钟0~59
var sec=date.getSeconds();//秒 0~59
var datetime=year+"年"+month+"月"+day+"日"+" "+xq+" "+hour+"时"+min+"分"+sec+"秒";//拼接一起,当然可以直接在这里修改显示格式
clock.innerHTML="<font>当前系统是 : "+datetime+"</font>";//以html文本形式显示在页面上
}
window.onload=function(){//window 对象调用onload在页面加载时执行该匿名函数
var timer=window.setInterval("getEClock(clock)", 1000);//setInterval("A()",B)每隔多少时间执行一次A方法
}
----------------------部分jsp文件------------------
<head>
<script language="javascript" src="js/getEClock.js"></script>
</head>
<body>
<div id="clock"></div><!--在此显示电子时钟-->
</body>
注：没有写样式css文件,这个到实际应用是根据不同需求再写就行了......
这显然是个小例子,也是个小开始,会在以后陆续,整理更多、更常用的小功能的.
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
