JS代码实现日期上下周切换功能

"JS实现日期上下周切换" 在JavaScript中，日期上下周切换的功能通常用于日历应用或者时间管理工具中。以下是如何使用JavaScript来实现这个功能的详细步骤： 首先，我们需要获取当前日期。在提供的代码中，可以看到如下部分： ```javascript var date = new Date(); var year = date.getFullYear(); var month = date.getMonth() + 1; var day = date.getDate(); var nowDate = year + "-" + month + "-" + day; ``` 这部分代码创建了一个新的`Date`对象，然后提取出年、月、日，并将它们组合成一个字符串`nowDate`，表示当前日期。 接着，定义了两个函数，用于计算当前日期是所在月份的第几周（`getMonthWeek`）和所在年的第几周（`getYearWeek`）： ```javascript var getMonthWeek = function(a, b, c) { var date = new Date(a, parseInt(b) - 1, c), w = date.getDay(), d = date.getDate(); return Math.ceil((d + 6 - w) / 7); }; var getYearWeek = function(a, b, c) { var date1 = new Date(a, parseInt(b) - 1, c), date2 = new Date(a, 0, 1), d = date1.getDay() - date2.getDay(); if (d < 0) d += 7; return Math.ceil((c + d) / 7); }; ``` `getMonthWeek`函数通过计算当前日期与月初第一天之间的天数，然后除以7并向上取整，得到当前日期是所在月份的第几周。`getYearWeek`函数则更复杂一些，它考虑了年初的第一天是星期几，从而准确计算出当年的第几周。 实现日期上下周切换，可以创建两个按钮，分别代表“上一周”和“下一周”。点击这些按钮时，更新日期并重新计算周数： ```html <button id="prevWeek">上一周</button> <button id="nextWeek">下一周</button> ``` 添加事件监听器处理按钮点击： ```javascript document.getElementById("prevWeek").addEventListener("click", function() { var prevDate = new Date(date.getTime() - 7 * 24 * 60 * 60 * 1000); // 减去一星期的时间 document.getElementById("nowDate").innerText = formatDate(prevDate); document.getElementById("nowMonthWeek").innerText = getMonthWeek(prevDate.getFullYear(), prevDate.getMonth() + 1, prevDate.getDate()); document.getElementById("nowYearWeek").innerText = getYearWeek(prevDate.getFullYear(), prevDate.getMonth() + 1, prevDate.getDate()); }); document.getElementById("nextWeek").addEventListener("click", function() { var nextDate = new Date(date.getTime() + 7 * 24 * 60 * 60 * 1000); // 加上一星期的时间 document.getElementById("nowDate").innerText = formatDate(nextDate); document.getElementById("nowMonthWeek").innerText = getMonthWeek(nextDate.getFullYear(), nextDate.getMonth() + 1, nextDate.getDate()); document.getElementById("nowYearWeek").innerText = getYearWeek(nextDate.getFullYear(), nextDate.getMonth() + 1, nextDate.getDate()); }); ``` 这里假设有一个`formatDate`函数用于将日期对象格式化为字符串。每次点击按钮，就会更新日期并显示新一周的周数。 最后，为了让代码在页面加载时生效，需要将上述代码包裹在`window.onload`函数内： ```javascript window.onload = function() { // ... 之前的代码 ... // 添加按钮点击事件监听器 }; ``` 通过这种方式，我们可以实现一个简单的JavaScript日期上下周切换功能。用户可以查看当前日期及其所在的周数，并可以通过点击按钮向前或向后切换一周。