js按指定格式显示日期时间的样式代码

下面我将详细讲解如何用 JavaScript 按指定的格式显示日期时间样式的代码攻略。

1. 获取当前的日期和时间

在编写代码显示日期和时间之前，我们需要先获取当前的日期和时间信息。这个过程可以通过 JavaScript 的内置对象 Date 来实现，如下所示：

var now = new Date();

这里定义了一个名为 now 的变量，并通过 new Date() 方法来获取当前的日期和时间。

2. 格式化日期和时间

得到当前日期和时间之后，我们需要对其进行格式化处理来呈现指定的时间日期格式。在 JavaScript 中，有许多格式化日期和时间输出的函数。这里我们将使用 toLocaleString() 和 Moment.js 两种方法演示。

2.1 使用 toLocaleString()

toLocaleString() 方法可以将日期时间信息格式化成指定的本地语言，并可以自定义格式，如下所示：

var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
var date = now.toLocaleString('en-US', options);

这里定义了一个名为 options 的变量，用来存储需要格式化的日期和时间信息。然后，我们通过 toLocaleString() 方法生成一个指定本地语言的日期，格式为 'Monday, July 26, 2021'。

2.2 使用 Moment.js

Moment.js 是一个简单易用的 JavaScript 日期处理库，可以处理和格式化各种格式的日期和时间。以下是使用 Moment.js 格式化日期和时间的代码示例：

var date = moment(now).format('MMMM Do YYYY, h:mm:ss a');

这里使用了 moment() 方法将日期时间信息转换成 Moment 对象，并使用 format() 方法将日期和时间信息格式化为指定的格式。以上格式化代码将日期和时间信息格式化为 'July 26th 2021, 3:20:12 pm' 的形式。

3. 完整代码示例

下面是使用 toLocaleString() 和 Moment.js 两种方法显示指定格式日期和时间的完整代码示例：

// 使用 toLocaleString() 显示日期和时间
var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
var date = now.toLocaleString('en-US', options);
console.log(date); // 输出结果："Monday, July 26, 2021"

// 使用 Moment.js 显示日期和时间
var date = moment(now).format('MMMM Do YYYY, h:mm:ss a');
console.log(date); // 输出结果："July 26th 2021, 3:20:12 pm"

注意，要使用 Moment.js 库，需要在 HTML 文件中添加以下代码：

<script src="https://cdn.jsdelivr.net/momentjs/2.24.0/moment.min.js"></script>

这样就可以成功使用 Moment.js 库了。

以上就是关于使用 JavaScript 按指定格式显示日期时间的样式代码的完整攻略，希望能对你有所帮助。