如何在 jQuery 中使用 Moment.js 更改日期格式？

在 jQuery 中使用 Moment.js 来更改日期格式，需要我们先引入 Moment.js 库，然后利用其提供的函数来解析、处理和格式化日期。我们可以通过简单的调用 moment(date).format(desiredFormat) 来将日期转换成各种我们想要的格式，从而在页面上展示。

moment() 函数：

moment() 函数主要用于从字符串创建一个 moment 对象。

语法：

moment(String);

参数： 它接受一个字符串作为参数。
返回值： 它返回一个 moment 对象。
format() 函数：

moment().format() 函数用于格式化日期。我们可以以字符串的形式提供格式，并将其作为参数传递给该方法。

语法：

moment().format(String);

参数： 该函数接受一个字符串类型的参数，用于定义日期的格式。
返回值： 该函数返回格式化后的日期。
CDN 链接：

>   

>   

>

实现步骤：

• 首先，在页面中添加 jQuery、Moment.js 和 Bootstrap 的 CDN 链接，或者直接从本地机器下载并引入它们。
• 创建一个日期输入框和一个提交按钮。
• 现在，使用 moment() 方法将输入的日期转换为一个 moment 对象。
• 使用 format() 方法来更改日期的格式。以下是将日期格式更改为 ‘DD-MM-YYYY‘ 的语法示例：

moment($("#date_val").val()).format(‘DD-MM-YYYY‘);

• 最后，利用 Bootstrap 为页面添加一些样式，使其更加美观。

日期格式化令牌：

描述

—

4 位年份

2 位年份

完整月份名称

3 字符月份缩写

月份，补零

月份

日期，补零

日期

带序数词的日期

示例：

在本例中，我们将使用 Moment.js 和 jQuery 将选定的日期转换为三种不同的格式并显示出来。当点击按钮时，日期会被重新格式化为不同的模式，并动态地展示在页面上。

HTML

INLINECODEe12e2de5`INLINECODE5d3f1abc`


输出：