JavaScript 日期对象

在 JavaScript 中,你可以使用 Date 对象来处理日期和时间。以下是一些常见的 Date 对象的使用方法:

1、创建日期对象:

html 复制代码
// 创建一个表示当前日期和时间的 Date 对象
let currentDate = new Date();

// 创建一个特定日期和时间的 Date 对象
let specificDate = new Date("2024-04-25T12:00:00");

// 也可以传入年、月、日等参数来创建 Date 对象
let customDate = new Date(2024, 3, 25); // 月份是从 0 开始计数,所以 3 表示四月

2、获取日期和时间的各个部分:

html 复制代码
let year = currentDate.getFullYear();
let month = currentDate.getMonth(); // 0 表示一月,11 表示十二月
let day = currentDate.getDate();
let hours = currentDate.getHours();
let minutes = currentDate.getMinutes();
let seconds = currentDate.getSeconds();
let milliseconds = currentDate.getMilliseconds();

3、设置日期和时间的各个部分:

html 复制代码
currentDate.setFullYear(2025);
currentDate.setMonth(4); // 设置为五月
currentDate.setDate(1);
currentDate.setHours(12);
currentDate.setMinutes(0);
currentDate.setSeconds(0);
currentDate.setMilliseconds(0);

4、格式化日期和时间为字符串:

html 复制代码
let formattedDate = currentDate.toISOString(); // 返回 ISO 8601 格式的字符串
console.log(formattedDate); // 输出类似 "2024-04-25T12:00:00.000Z" 的字符串

5、计算日期之间的差值:

html 复制代码
let diffInMilliseconds = specificDate.getTime() - currentDate.getTime();
let diffInSeconds = diffInMilliseconds / 1000;
let diffInMinutes = diffInMilliseconds / (1000 * 60);
// 同样,你也可以计算小时、天数等

有时候需要对时间进行补零操作。比如:09:01:08等

6、简单的页面倒计时代码(js部分):

html 复制代码
// 设置目标日期和时间(倒计时结束时间)
const targetDate = new Date("2024-12-31T23:59:59").getTime();

// 更新倒计时函数
function updateCountdown() {
    // 获取当前时间
    const currentDate = new Date().getTime();

    // 计算距离目标日期的时间差(毫秒数)
    const distance = targetDate - currentDate;

    // 计算倒计时的天、时、分、秒
    const days = Math.floor(distance / (1000 * 60 * 60 * 24));
    const hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
    const minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
    const seconds = Math.floor((distance % (1000 * 60)) / 1000);

    // 更新页面上的倒计时显示
    const countdownElement = document.getElementById('countdown');/获取盒子的id
    countdownElement.innerHTML = `倒计时:${days}天 ${hours}时 ${minutes}分 ${seconds}秒`;

    // 如果目标日期已过,则显示倒计时结束
    if (distance < 0) {
        countdownElement.innerHTML = "倒计时结束";
    }
}

// 初始调用一次更新倒计时函数,确保页面加载时立即显示正确的倒计时
updateCountdown();

// 每秒调用一次更新倒计时函数,实现实时更新倒计时
setInterval(updateCountdown, 1000);
相关推荐
知乎的哥廷根数学学派16 分钟前
基于生成对抗U-Net混合架构的隧道衬砌缺陷地质雷达数据智能反演与成像方法(以模拟信号为例,Pytorch)
开发语言·人工智能·pytorch·python·深度学习·机器学习
yeziyfx1 小时前
kotlin中 ?:的用法
android·开发语言·kotlin
charlie1145141911 小时前
嵌入式的现代C++教程——constexpr与设计技巧
开发语言·c++·笔记·单片机·学习·算法·嵌入式
古城小栈1 小时前
Rust 网络请求库:reqwest
开发语言·网络·rust
hqwest2 小时前
码上通QT实战12--监控页面04-绘制6个灯珠及开关
开发语言·qt·qpainter·qt事件·stackedwidget
i橡皮擦2 小时前
TheIsle恐龙岛读取游戏基址做插件(C#语言)
开发语言·游戏·c#·恐龙岛·theisle
哈__2 小时前
React Native 鸿蒙跨平台开发:PixelRatio 像素适配
javascript·react native·react.js
bing.shao2 小时前
golang 做AI任务执行
开发语言·人工智能·golang
用户6387994773052 小时前
每组件(Per-Component)与集中式(Centralized)i18n
前端·javascript
DarkLONGLOVE3 小时前
Vue组件使用三步走:创建、注册、使用(Vue2/Vue3双版本详解)
前端·javascript·vue.js