欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

JavaScript獲取當(dāng)前日期與時(shí)間的方法示例詳解

 更新時(shí)間:2025年07月01日 09:53:10   作者:小二愛編程·  
這篇文章主要介紹了JavaScript獲取當(dāng)前日期與時(shí)間的方法,以下是一些js中常見的時(shí)間操作案例,這些案例涵蓋了日期和時(shí)間的獲取、格式化、計(jì)算等操作,幫助你在實(shí)際開發(fā)中處理時(shí)間相關(guān)的問題,需要的朋友可以參考下

前言

在 JavaScript 中,可以通過 Date 對(duì)象來獲取系統(tǒng)當(dāng)前的時(shí)間信息,并使用 getFullYear()、getMonth()getDate()、getHours() 等方法提取具體的年、月、日、時(shí)、分、秒等信息,最后通過 DOM 操作(如 innerHTML)將時(shí)間顯示在網(wǎng)頁上。

一、獲取當(dāng)前時(shí)間對(duì)象

var now = new Date(); // 創(chuàng)建一個(gè)表示當(dāng)前時(shí)間的對(duì)象

二、常用方法解析

方法描述
getFullYear()獲取當(dāng)前年份(四位數(shù)字,例如:2025)? 推薦使用
getMonth()獲取月份(從 0 開始,即 0 表示 1 月,11 表示 12 月)
getDate()獲取日期(1 ~ 31)
getDay()獲取星期幾(0 表示星期日,1~6 表示星期一到星期六)
getHours()獲取小時(shí)數(shù)(0 ~ 23)
getMinutes()獲取分鐘數(shù)(0 ~ 59)
getSeconds()獲取秒數(shù)(0 ~ 59)

?? 注意:

  • getYear() 已被棄用,推薦使用 getFullYear()
  • getMonth() 返回值比實(shí)際月份小 1,需要加 1 才能顯示正確月份。

三、示例代碼:獲取并打印時(shí)間信息

var now = new Date();

console.log("年:" + now.getFullYear());
console.log("月:" + (now.getMonth() + 1)); // 加 1
console.log("日:" + now.getDate());
console.log("時(shí):" + now.getHours());
console.log("分:" + now.getMinutes());
console.log("秒:" + now.getSeconds());
console.log("星期:" + now.getDay());

四、完整示例:實(shí)時(shí)顯示當(dāng)前時(shí)間

HTML + CSS 部分

<style>
.time span {
    display: inline-block;
    width: 40px;
    height: 20px;
}
</style>

<div class="time">
    當(dāng)前時(shí)間:<br><br>
    <span id="year"></span>年
    <span id="month"></span>月
    <span id="day"></span>日
    <span id="hour"></span>時(shí)
    <span id="minute"></span>分
    <span id="second"></span>秒
</div>

JavaScript 實(shí)現(xiàn)

function showTime() {
    var now = new Date();

    var year = now.getFullYear();
    var month = now.getMonth() + 1; // 注意加 1
    var day = now.getDate();
    var hour = now.getHours();
    var minute = now.getMinutes();
    var second = now.getSeconds();

    // 更新頁面內(nèi)容
    document.getElementById("year").innerHTML = year;
    document.getElementById("month").innerHTML = month;
    document.getElementById("day").innerHTML = day;
    document.getElementById("hour").innerHTML = hour;
    document.getElementById("minute").innerHTML = minute;
    document.getElementById("second").innerHTML = second;
}

// 初始調(diào)用一次
showTime();

// 每隔 1 秒更新一次時(shí)間
setInterval(showTime, 1000);

五、另一種寫法:直接拼接字符串顯示時(shí)間

HTML 部分

<div id="clock"></div>

JavaScript 部分

function updateTime() {
    var date = new Date();

    var year = date.getFullYear();
    var month = date.getMonth() + 1;
    var day = date.getDate();
    var hours = date.getHours();
    var minutes = date.getMinutes();
    var seconds = date.getSeconds();

    var week = ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"];
    var currentWeek = week[date.getDay()];

    // 格式化為統(tǒng)一格式
    var timeStr = `${year}年${month}月${day}日 ${hours}:${minutes}:${seconds} ${currentWeek}`;

    document.getElementById("clock").innerText = timeStr;
}

updateTime();
setInterval(updateTime, 1000);

六、總結(jié)

功能方法
獲取年份getFullYear() ? 推薦使用
獲取月份getMonth() + 1(注意加 1)
獲取日期getDate()
獲取星期getDay() → 可映射成中文
獲取小時(shí)getHours()
獲取分鐘getMinutes()
獲取秒數(shù)getSeconds()
顯示時(shí)間使用 innerHTML 或 innerText 更新頁面元素
實(shí)時(shí)更新使用 setInterval(fn, 1000) 每秒刷新一次

七、注意事項(xiàng)

  • getMonth() 返回的是從 0 開始的月份,記得手動(dòng)加 1;
  • getYear() 不推薦使用,已過時(shí);
  • 如果需要國際化,可結(jié)合 Intl.DateTimeFormat 處理;
  • 實(shí)時(shí)時(shí)間功能適用于電子鐘、計(jì)時(shí)器、狀態(tài)欄等場(chǎng)景。

到此這篇關(guān)于JavaScript獲取當(dāng)前日期與時(shí)間方法的文章就介紹到這了,更多相關(guān)JS獲取當(dāng)前日期與時(shí)間內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

相關(guān)文章

最新評(píng)論