JS实现网页时钟
JS实现网页时钟
1.js获取时间new data
var myDate = new Date();//获取系统当前时间myDate.getYear(); //获取当前年份(2位)
myDate.getFullYear(); //获取完整的年份(4位,1970-????)
myDate.getMonth(); //获取当前月份(0-11,0代表1月)
myDate.getDate(); //获取当前日(1-31)
myDate.getDay(); //获取当前星期X(0-6,0代表星期天)
myDate.getTime(); //获取当前时间(从1970.1.1开始的毫秒数)
myDate.getHours(); //获取当前小时数(0-23)
myDate.getMinutes(); //获取当前分钟数(0-59)
myDate.getSeconds(); //获取当前秒数(0-59)
myDate.getMilliseconds(); //获取当前毫秒数(0-999)
myDate.toLocaleDateString(); //获取当前日期
var mytime=myDate.toLocaleTimeString(); //获取当前时间
myDate.toLocaleString( ); //获取日期与时间
2.HTML DOM innerHTML 属性
定义和用法：
innerHTML 属性设置或返回表格行的开始和结束标签之间的 HTML。
语法：
HTMLElementObject.innerHTML=text
例如：
比如在<body>中写了如下的代码：
<div id=top></div>
现在用top.innerHTML="..........";的方法就可以向这个id的位置写入HTML代码了。
例如top.innerHTML="<input type="button" name="我很帅" value="说的对">";就可以在top对应的位置出现一个button了。
3.网页时钟具体实现代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>网页时钟</title>
<script type="text/javascript">
//判断时间是否为个位数，如果时间为个位数就在时间之前补上一个“0”
function check(val) {
if (val < 10) {
return ("0" + val);
}
else {
return (val);
}
}
function displayTime() {
//获取div元素
var timeDiv=document.getElementById("timeDiv");
//获取系统当前的年、月、日、小时、分钟、毫秒
var date = new Date();
var year = date.getFullYear();
var month = date.getMonth() + 1;
var day = date.getDate();
var hour = date.getHours();
var minutes = date.getMinutes();
var second = date.getSeconds();
var timestr = year + "年" + month + "月" + day + "日 " + check(hour)
+ ":" + check(minutes) + ":" + check(second);
//将系统时间设置到div元素中
timeDiv.innerHTML = timestr;
}
//每隔1秒调用一次displayTime函数
function start(){
window.setInterval("displayTime()",1000)//单位是毫秒
}
</script>
</head>
<!-- body onload:当整个html页面加载完成后执行此函数 -->
<body onload="start();">
<div id="timeDiv"></div>
</body>
</html>