js设置日期和时间方法,js怎么设置时间

大家好,本文将围绕js设置日期和时间方法展开说明,js怎么设置时间是一个很多人都想弄明白的事情,想搞清楚js设置时间延迟需要先了解以下几个事情。

当前在 JavaScript 中管理日期和时间的方法是使用 Date() 对象。还行,但不太好Python中的所有运算符号

它具有从字符串创建 Date() 对象、格式化日期和时间以及取回特定值的方法。但它缺乏从日期中添加或减去时间的原生方法。时区支持也很糟糕。

有一个新的 API 正在开发中:Temporal()。它将允许您执行以下操作:

// 目前浏览器中不支持这一点。
Temporal.Now.instant().add({ hours: 5, seconds: 20 })

它目前是第 3 阶段的提案,这意味着它与标准流程相距甚远。

那么,我们先来看看 Date() 的一些用法。

创建 Date() 对象

您可以使用 new Date() 构造函数创建 Date() 对象。

如果不传入任何参数,它将为当前运行的时刻创建一个 Date() 对象。也可以将日期字符串作为参数传入。

结果 Date() 对象与您当前的时区相关。

// 现在的日期对象
let now = new Date()

// 国庆节日期对象
let nationalDay = new Date('October 1, 2022')

您还可以通过传入一系列参数来创建日期:yearmonthIndexdayhoursminutessecondsmilliseconds。只有 yearmonthIndex 是必需的。

monthIndex 参数让人感到困惑,因为它从 1 月的 0 开始,而不是 1

// 请注意,尽管 10 月是第 10 个月,但月份指数是 9
let halloween = new Date(2022, 10, 1)

// 当地时间国庆节上午 10:00
let nationalDay = new Date(2022, 10, 1, 10, 00)

十二月份的月份数为 0:

let December = new Date(2022, 10)
December.getHours() // 0

它很笨重,但很实用。

修改日期

Date() 对象提供了一些实例方法,可以用来获取和修改日期和时间。它们遵循 get*()set*() 命名约定,其中 * 是要获取或设置的属性。

例如,要获取 nationalDayhoursmonth 属性,使用 getHours()getMonth

nationalDay.getHours() // 10

// 记住:它从 0 开始
nationalDay.getMonth() // 10

要设置 hoursmonth 属性,使用 setHours()setMonth,传入想要设置的时间参数即可。它使用 24 小时制的时钟。

// 将时间设置为下午 2 点,14 小时
nationalDay.setHours(14)

// 把月份定在 7 月
nationalDay.setMonth(6)

添加和删除时间

现在,为了添加和删除时间,我们可以结合使用 get*()set*() 方法。

例如,要向一个时间添加 4 小时,可以使用 getHours() 方法获取当前的小时数,再向其中添加 4 小时,然后将结果传递给 setHours() 方法。

// 将时间设置为下午 6 点(下午 2 点 +4 小时)
nationalDay.setHours(nationalDay.getHours() + 4)

如果由此产生的调整会让您进入下一天、下个月、下一年等,那么 Date() 对象会自动考虑这一点并正确地进行调整。

// 将日期设置为 12 月 26 日凌晨 2 点(12 月 25 日下午 6 点 +8 小时)
nationalDay.setHours(nationalDay.getHours() + 8)

格式化日期

修改日期和时间后,可以将其格式化为字符串。

有两种方法:Date.toLocaleString() 方法和 Intl.dateTimeFormat() 方法。

nationalDay.toLocaleString(navigator.language, {
  dateStyle: 'full',
  timeStyle: 'short',
  hour12: true
}) // '2022年7月2日星期六 上午2:00'

new Intl.DateTimeFormat(navigator.language, {
  dateStyle: 'full',
  timeStyle: 'short',
  hour12: true
}).format(nationalDay) // '2022年7月2日星期六 上午2:00'

它们都支持相同的格式选项。Date.toLocaleString() 方法较旧,但使用起来更容易一些。如果您使用相同的设置格式化大量日期,那么 Intl.dateTimeFormat() 方法方法的性能会更好。

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
在Bootstrap中,您可以使用Bootstrap Datepicker插件来实现日期选择器,并将最小日期设置为2017年。以下是基于Bootstrap Datepicker的示例代码: ```html <!DOCTYPE html> <html> <head> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/css/bootstrap-datepicker.min.css"> </head> <body> <input type="text" id="datepicker"> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.min.js"></script> <script> $(function() { $('#datepicker').datepicker({ format: 'yyyy', minViewMode: 'years', startDate: '2017', endDate: '+Infinity' }); }); </script> </body> </html> ``` 在上面的示例中,我们首先引入了Bootstrap Datepicker插件所需的CSS和JavaScript文件。然后,在文档准备就绪时,我们初始化了一个具有id为"datepicker"的输入框,并将日期选择器应用于它。 通过在初始化选项中设置`format: 'yyyy'`,我们指定日期格式为年份。然后,通过`minViewMode: 'years'`设置最小视图模式为年份级别,这样用户只能选择年份。 最后,通过设置`startDate: '2017'`,我们将最小日期设置为2017年。这样,用户将只能选择从2017年开始的年份。 请注意,具体实现取决于您所使用的日期插件和其提供的选项。您可以根据自己的需求调整和配置选项来满足您对最小时间设置的要求。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值