做網(wǎng)站公司在深圳杭州疫情最新情況
今天是第九天，學(xué)習(xí)了JS中的設(shè)置日期和倒計(jì)時，計(jì)時器以及驗(yàn)證碼倒計(jì)時，那么話不多說我們開始今天的學(xué)習(xí)吧
一、日期設(shè)置
1.1日期創(chuàng)建
調(diào)用?new Date()?來創(chuàng)建一個新的?Date?對象。在調(diào)用時可以帶有一些參數(shù)，創(chuàng)建一個?Date?對象，其時間等于 1970 年 1 月 1 日 UTC+0 之后經(jīng)過的毫秒數(shù)（1/1000 秒）。
傳入的整數(shù)參數(shù)代表的是自 1970-01-01 00:00:00 以來經(jīng)過的毫秒數(shù)，該整數(shù)被稱為?時間戳。
這是一種日期的輕量級數(shù)字表示形式。我們通常使用?new Date(timestamp)?通過時間戳來創(chuàng)建日期，并可以使用?date.getTime()?將現(xiàn)有的?Date?對象轉(zhuǎn)化為時間戳（下文會講到）。
new Date(datestring)
如果只有一個參數(shù)，并且是字符串，那么它會被自動解析。該算法與?Date.parse?所使用的算法相同，將在下文中進(jìn)行介紹。
new Date(year, month, date, hours, minutes, seconds, ms)
使用當(dāng)前時區(qū)中的給定組件創(chuàng)建日期。只有前兩個參數(shù)是必須的。
year?應(yīng)該是四位數(shù)。為了兼容性，也接受 2 位數(shù)，并將其視為?19xx，例如?98?與?1998?相同，但強(qiáng)烈建議始終使用 4 位數(shù)。month?計(jì)數(shù)從?0（一月）開始，到?11（十二月）結(jié)束。date?是當(dāng)月的具體某一天，如果缺失，則為默認(rèn)值?1。- 如果?
hours/minutes/seconds/ms?缺失，則均為默認(rèn)值?0。
1.2
訪問日期組件
從?Date?對象中訪問年、月等信息有多種方式：
getFullYear()
獲取年份（4 位數(shù)）
getMonth()
獲取月份，從 0 到 11。
getDate()
獲取當(dāng)月的具體日期，從 1 到 31，這個方法名稱可能看起來有些令人疑惑。
getHours()，getMinutes()，getSeconds()，getMilliseconds()
獲取相應(yīng)的時間組件。
不是?getYear()，而是?getFullYear()
很多 JavaScript 引擎都實(shí)現(xiàn)了一個非標(biāo)準(zhǔn)化的方法?getYear()。不推薦使用這個方法。它有時候可能會返回 2 位的年份信息。永遠(yuǎn)不要使用它。要獲取年份就使用?getFullYear()。
另外，我們還可以獲取一周中的第幾天：
getDay()
獲取一周中的第幾天，從?0（星期日）到?6（星期六）。第一天始終是星期日，在某些國家可能不是這樣的習(xí)慣，但是這不能被改變。
以上的所有方法返回的組件都是基于當(dāng)?shù)貢r區(qū)的。
當(dāng)然，也有與當(dāng)?shù)貢r區(qū)的 UTC 對應(yīng)項(xiàng)，它們會返回基于 UTC+0 時區(qū)的日、月、年等：getUTCFullYear()，getUTCMonth()，getUTCDay()。只需要在?"get"?之后插入?"UTC"?即可。
getTime()
返回日期的時間戳 —— 從 1970-1-1 00:00:00 UTC+0 開始到現(xiàn)在所經(jīng)過的毫秒數(shù)。
getTimezoneOffset()
返回 UTC 與本地時區(qū)之間的時差，以分鐘為單位。
下列方法可以設(shè)置日期/時間組件：
- setFullYear(year, [month], [date])
- setMonth(month, [date])
- setDate(date)
- setHours(hour, [min], [sec], [ms])
- setMinutes(min, [sec], [ms])
- setSeconds(sec, [ms])
- setMilliseconds(ms)
- setTime(milliseconds)（使用自 1970-01-01 00:00:00 UTC+0 以來的毫秒數(shù)來設(shè)置整個日期）
以上方法除了?setTime()?都有 UTC 變體，例如：setUTCHours()。
我們可以看到，有些方法可以一次性設(shè)置多個組件，比如?setHours。未提及的組件不會被修改。
二、倒計(jì)時
可以使用 JavaScript 的計(jì)時器函數(shù)?setInterval()?來實(shí)現(xiàn)倒數(shù)計(jì)時器。
<!DOCTYPE html>
<html>
<head><title>倒數(shù)計(jì)時器</title>
</head>
<body><h1 id="countdown"></h1><script>// 倒數(shù)計(jì)時器總時間（以秒為單位）var totalSeconds = 60;// 獲取顯示倒數(shù)計(jì)時器的元素var countdownElement = document.getElementById("countdown");// 更新倒數(shù)計(jì)時器函數(shù)function updateCountdown() {// 計(jì)算剩余時間var minutes = Math.floor(totalSeconds / 60);var seconds = totalSeconds % 60;// 格式化時間字符串var timeString = minutes.toString().padStart(2, '0') + ":" + seconds.toString().padStart(2, '0');// 更新顯示倒數(shù)計(jì)時器的元素countdownElement.innerHTML = "倒數(shù)計(jì)時器: " + timeString;// 減少剩余時間totalSeconds--;// 如果剩余時間小于等于 0，則停止計(jì)時器if (totalSeconds <= 0) {clearInterval(countdownTimer);countdownElement.innerHTML = "倒數(shù)計(jì)時器: 時間到！";}}// 啟動倒數(shù)計(jì)時器var countdownTimer = setInterval(updateCountdown, 1000);</script>
</body>
</html>在這個例子中，我們首先設(shè)置了倒數(shù)計(jì)時器總時間（60 秒），然后獲取了一個 HTML 元素來顯示計(jì)時器，并創(chuàng)建了一個函數(shù) updateCountdown() 來更新計(jì)時器的顯示。
函數(shù) updateCountdown() 首先計(jì)算剩余時間（分鐘和秒數(shù)），然后格式化這些時間為一個字符串，并更新顯示計(jì)時器的元素。接著，它減少剩余時間，并檢查是否需要停止計(jì)時器（即剩余時間是否小于等于 0），如果需要停止，就清除計(jì)時器并更新顯示計(jì)時器的元素。
最后，我們使用 setInterval() 函數(shù)啟動倒數(shù)計(jì)時器，每秒鐘調(diào)用一次 updateCountdown() 函數(shù)來更新計(jì)時器的顯示。
三、定時器
<script>// 定時器// 每隔一段時間 重復(fù)執(zhí)行一段代碼// 一次性定時器 延時定時器//設(shè)置一次性定時器 定時器//setTimeout(function(){執(zhí)行的代碼}，毫秒var n1 = setTimeout(function(){alert(666)},2000)var n2 = setTimeout(function(){alert(777)},3000)var n3 = setTimeout(function(){alert(888)},4000)//關(guān)閉一次性定時器 clearTimeout(n2)// 重復(fù)性定時器 周期定時器// var timer = setInterval(function(){執(zhí)
// clearInterval(timer)var i= 1;var timer = setInterval(function(){ i++;console.log(i) },1000)clearInterval(timer);</script>什么是定時器
JS提供了一些原生方法來實(shí)現(xiàn)延時去執(zhí)行某一段代碼
setTimeout：
設(shè)置一個定時器，在定時器到期后執(zhí)行一次函數(shù)或代碼段
setInterval:
以固定的時間間隔重復(fù)調(diào)用一個函數(shù)或者代碼段
四、驗(yàn)證碼倒計(jì)時
<button id="but" >5秒</button>
<script>var sec = 5;//5秒倒計(jì)時var timer = setInterval(function(){//秒數(shù)-1sec--;// 設(shè)置按鈕里的文本內(nèi)容but.innerHTML = sec+'秒'// 按鈕 禁用but.disabled = true;//當(dāng)秒數(shù)小于0，停止定時器if(sec <= 0){//停止定時器clearInterval(timer);//按鈕的文字修改成獲取驗(yàn)證碼but.innerHTML = '獲取驗(yàn)證碼'//按鈕取消禁用but.disabled = false;}},1000)</script>驗(yàn)證碼倒計(jì)時也是常用的，一定要牢記哦。
今天的學(xué)習(xí)到此結(jié)束。