@Author:Runsen
@Date:2020/05/29
作者介紹:Runsen目前大三下學期,專業化學工程與工藝,大學沉迷日語,Python, Java和一系列數據分析軟件。導致翹課嚴重,專業排名中下。.在大學60%的時間,都在CSDN。決定今天比昨天要更加努力。
今天介紹的是JavaScript中的Date,我先去W3C偷窺學習下。
Date
Date對象是 JavaScript原生的時間庫。它以1970年1月1日00:00:00作爲時間的零點,可以表示的時間範圍是前後各1億天(單位爲毫秒)。
Date對象的創建
Date對象的創建就是一個new命令,會返回一個Date對象的實例;如果不加參數,實例代表的就是當前時間。
var today = new Date();
console.log(today.toString());
Date用法
下面的代碼包含了Date日期對象所有用法
<body>
<script>
var data = new Date();
// var strap = data.getTime();
// alert(strap);
var year = data.getFullYear();
var mon = data.getMonth()+1;
var date = data.getDate();
var hour = data.getHours();
var min = data.getMinutes();
var sec = data.getSeconds();
var day = data.getDay();
document.body.innerHTML = year + "年" + mon + "月" + date + "日" + hour + "時" + min + "分" + sec + "秒" + "星期" + day;
</script>
</body>
練習
實現時間的變化
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
* {
margin: 0;
padding: 0;
}
div{
width: 100%;
height: 100px;
line-height: 100px;
text-align: center;
background: #aa8899;
margin-bottom: 20px;
}
div p{
font-size: 20px;
color: #aa132b;
font-weight: bolder;
}
</style>
</head>
<body>
<div id="box">
敵軍還有<span id="time">30</span>秒到達戰場
</div>
<div id="wrap"></div>
<script>
var oBox = document.getElementById("box");
var oWrap = document.getElementById("wrap");
var oTime = document.getElementById("time");
var timer;
var num = 30;
timer = setInterval(function () {
num --;
oTime.innerHTML = num;
if(num === 0){
clearInterval(timer);
oBox.innerHTML = "<p>打死他</p>";
}
},1000);
function change() {
var data = new Date();
var year = data.getFullYear();
var mon = data.getMonth()+1;
var date = data.getDate();
var hour = data.getHours();
var min = data.getMinutes();
var sec = data.getSeconds();
var day = data.getDay();
hour = toTwo(hour);
min = toTwo(min);
sec = toTwo(sec);
function toTwo(n) {
if(n< 10){//0123456789
n ="0" + n;//00 01 ----09
}
return n;
}
oWrap.innerHTML = year + "年" + mon + "月" + date + "日" + hour + "時" + min + "分" + sec + "秒"+ "星期"+ day;
}
change();
setInterval(change,1000);
</script>
</body>
</html>
這些都是我2018學的,然後就是不斷地複習,我擦,5/30到了。