使用 jQuery 添加 7 天的日期 - JavaScript

在 JavaScript 中使用 jQuery，我们可以轻松地添加七天的日期列表，这在很多网站和应用程序上都可以使用。本文将会讲解如何使用 jQuery 添加七天的日期，并提供代码示例。

准备工作

首先，在 HTML 文件中添加一个空的 div 元素，作为将要添加日期列表的容器：

<div id="date-list"></div>

然后，在 head 标签中添加以下代码，引入 jQuery 库：

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

添加日期列表

接着，我们使用以下代码来添加七天的日期列表：

$(document).ready(function() {
  var dateList = $("#date-list");
  for (var i = 0; i < 7; i++) {
    var date = new Date();
    date.setDate(date.getDate() + i);
    var dateStr = date.toISOString().substr(0, 10);
    dateList.append("<div>" + dateStr + "</div>");
  }
});

代码解读：

• 首先，我们使用 $(document).ready() 函数来确保 DOM 已经加载完毕后再执行脚本。
• 然后，我们定义了一个名为 dateList 的变量，用于存储日期列表容器。
• 接着，我们创建一个循环，循环七次，每次循环都会创建一个新的 Date 对象。
• 然后，我们使用 setDate() 函数设置日期对象的值，并将当前日期加上循环次数 i 的天数。
• 接着，我们使用 toISOString() 函数将日期对象转换为字符串，并使用 substr() 函数截取前 10 个字符，即日期字符串（格式为“YYYY-MM-DD”）。
• 最后，我们使用 append() 函数在日期列表容器中添加一个 div 元素，其中包含日期字符串作为文本内容。

示例代码

完整的示例代码如下：

$(document).ready(function() {
  var dateList = $("#date-list");
  for (var i = 0; i < 7; i++) {
    var date = new Date();
    date.setDate(date.getDate() + i);
    var dateStr = date.toISOString().substr(0, 10);
    dateList.append("<div>" + dateStr + "</div>");
  }
});

结论

使用 jQuery，我们可以轻松地添加七天的日期列表。以上就是如何使用 jQuery 添加七天的日期的介绍，希望对您有所帮助！