首頁 > web前端 > js教程 > 主體

javascript中如何取得目前時間

青灯夜游
發布: 2023-01-07 11:41:18
原創
86081 人瀏覽過

在javascript中,可以使用Date對像中的Date()方法來取得當前時間,該方法可返回當天的日期和時間;也可以使用「new Date()」建立時間對象,利用內建的時間讀取方法,分別取得年、月、日、時、分、秒等資訊。

javascript中如何取得目前時間

本教學操作環境:windows7系統、javascript1.8.5版、Dell G3電腦。

在javascript中可以使用Date物件中的Date()方法來取得目前時間。 Date() 方法可傳回當天的日期和時間。

Date()
登入後複製

範例:輸出今天的日期和時間

console.log(Date())
登入後複製

輸出:

javascript中如何取得目前時間

或使用Date物件中不同方法,格式化時間,以固定格式顯示時間。

首先使用new Date() 建立一個現在時間對象,然後使用get 為前綴時間讀取方法,分別獲取現在時的年、月、日、時、分、秒等信息,最後透過定時器設定每秒執行一次,實現即時更新。

【操作步驟】

1) 設計時間顯示函數,在這個函數中先建立Date 對象,取得目前時間,然後分別取得年份、月份、日份、時、分、秒等訊息,最後組裝成一個時間字串並傳回。

var showtime = function () {
    var nowdate = new Date();
    var year = nowdate.getFullYear(),
        month = nowdate.getMonth() + 1,
        date = nowdate.getDate(),
        day = nowdate.getDay(),
        week = ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"],
        h = nowdate.getHours(),
        m = nowdate.getMinutes(),
        s = nowdate.getSeconds(),
        h = checkTime(h),
        m = checkTime(m),
        s = checkTime(s);
    return year + "年" + month + "月" + date + "日" + week[day] + " " + h +":" + m + ":" + s;
}
登入後複製

2) 因為平常看到的時間格式一般是00:00:01,而getHours()、getMinutes()、getSeconds() 方法得到格式是0 到9,而不是00 到09 這樣的格式。所以在從 9 變成 10的過程中,從一位數變成兩位數,同樣再從 59秒變成 0 秒,或是 59 分變成 0 分,或是 23 時變成 0 時。例如:23:59:59 的下一秒應該是00:00:00 ,實際為0:0:0,這樣格式上就不統一,在視覺上也是數字突然增加,或突然減少,產生一種晃動的感覺。

下面定義一個輔助函數,把一位數字的時間改為兩位數字顯示。

var checkTime = function (i) {
    if (i < 10) {
        i = "0" + i;
    }
    return i;
}
登入後複製

3) 在頁面中新增一個標籤,設定 id 的值。

<h1 id="showtime"></h1>
登入後複製

4) 為標籤綁定定時器,在定時器中設定每秒鐘呼叫一次時間顯示函數。

var div = document.getElementById("showtime");
setInterval (function() {
    div.innerHTML = showtime();
}, 1000);  //反复执行函数
登入後複製

顯示結果如下:

javascript中如何取得目前時間

【相關推薦:javascript學習教學##】

以上是javascript中如何取得目前時間的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板