JS學習筆記 Date物件及定時器操作
阿新 • • 發佈:2018-11-30
1.Date物件基本使用
<script> // 1. 宣告日期物件 var date = new Date(); // console.log(date); console.log(date.getDate()); // 日 console.log(date.getDay()); // 星期幾 console.log(date.getMonth() + 1); // 月 console.log(date.getFullYear() ); // 完整的年份 console.log(date.getHours() ); // 小時 console.log(date.getMinutes() ); // 分鐘 console.log(date.getSeconds() ); // 秒 console.log(date.getMilliseconds() ); // 毫秒 console.log(date.getTime() ); // 時間戳 </script>
2.定時器操作
建立以及清除定時器:
<script> window.onload = function () { // 1.獲取需要的標籤 var btn1 = document.getElementById("btn1"); var btn2 = document.getElementById("btn2"); var height = 150, timer = null; // 2. 開啟定時器 btn1.onclick = function () { // 2.1 設定定時器 timer = setInterval(function () { height += 1; console.log("身高是" + height + "cm"); }, 1000); }; // 3. 結束定時器 btn2.onclick = function () { console.log(timer); clearInterval(timer); } } </script>
但是這種寫法可能會出現問題,那就是可能會出現定時器疊加的後果,所以,我們一般都是先清除定時器,再設定定時器。
自定義時間:
<script> // 1. 自定義現在的時間 var currentDate = new Date(); console.log(currentDate); var nextDate = new Date('2018/08/08 08:17:35'); console.log(nextDate); var preDate = new Date('2017/08/08 08:17:35'); console.log(preDate); </script>
一次定時器:
<script>
window.onload = function () {
// 1. 獲取需要的標籤
var btn = document.getElementById("btn");
var btn1 = document.getElementById("btn1");
var timer = null;
// 2. 監聽按鈕的點選
btn.onclick = function () {
clearTimeout(timer);
// 一次定時器
timer = setTimeout(function () {
alert('請你去吃飯');
}, 3000);
};
btn1.onclick = function () {
clearTimeout(timer);
}
}
</script>