Date 对象用于处理日期与时间。
一、创建Date对象
1.获取当前时间---【 var date = new Date();】
2.自定义时间---【 var nexD = new Date('2019/12/18 17:30:00');】
二、Date对象常用方法
| 方法 |
描述 |
| getDate() |
返回一个月的某一天（1-31） |
| getDay() |
返回一周中的某一天（0-6） var week = date.getDay(); var weeks = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六']; console.log(weeks[week]); |
| getMonth() |
返回月份（0-11）注意：获取正确的月份需要+ 1 var m = date.getMonth() + 1; |
| getFullYear() |
返回年份 |
| getHours() |
返回小时（0-23） |
| getMinutes() |
返回分钟（0-59） |
| getSeconds() |
返回秒（0-59） |
| getMilliseconds() |
返回毫秒（0-999） |
| getTime() |
返回1970年1月1日至今的毫秒数（时间戳） |
示例：显示日期与时间
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>日期时间</title>
<style>
#box {
width: 260px;
height: 300px;
background-color: orangered;
margin: 100px auto;
padding: 20px;
}
#box_top {
font-size: 23px;
color: #fff;
margin-bottom: 40px;
}
#box_bottom {
width: 90%;
height: 70%;
background-color: orange;
margin: 0 auto;
font-size: 50px;
color: #fff;
display: flex;
justify-content: center;
align-items: center;
}
</style>
</head>
<body>
<div id="box">
<div id="box_top"></div>
<div id="box_bottom"></div>
</div>
<script>
window.onload = function() {
setInterval(function() {
var date = new Date();
var year = date.getFullYear();
var month = date.getMonth() + 1;
var day = date.getDate();
var week = date.getDay();
var hour = date.getHours();
var minute = date.getMinutes();
var second = date.getSeconds();
var weeks = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
$('box_top').innerText = year + '年' + month + '月' + day + '日 ' + weeks[week];
$('box_bottom').innerHTML = size(hour) + ':' + size(minute) + ':' + size(second);
}, 1000);
};
function size(num) {
return num >= 10 ? num : '0' + num;
}
function $(id) {
return typeof id === 'string' ? document.getElementById(id) : null;
}
</script>
</body>
</html>
