window.onload未完整执行getWeekly函数的问题求助

核心原因是异步数据加载的时机不匹配：
fetch("./data.json")是异步操作，页面window.onload触发时，数据还没加载完成，Data数组是空的，所以循环逻辑因为Data.length === 0直接跳过；而点击按钮时，fetch已经完成，Data有数据，所以能正常执行。

具体修复方案 #

方案1：确保数据加载完成后再执行getWeekly() #

修改fetch的回调逻辑，把getWeekly()的调用放在数据成功加载后的回调里，保证Data有值时再执行循环：

let Data = [];
let dailyBtn, weeklyBtn, monthlyBtn;

// 先获取DOM元素，避免变量提升问题
document.addEventListener('DOMContentLoaded', () => {
  dailyBtn = document.getElementById("daily");
  weeklyBtn = document.getElementById("weekly");
  monthlyBtn = document.getElementById("monthly");
});

fetch("./data.json")
  .then((response) => response.json())
  .then((data) => {
    Data.push(...data);
    getWeekly(); // 数据加载完成后执行
  });

// 其余函数逻辑不变...

方案2：修正window.onload的写法（辅助优化） #

你原来的window.onload = getWeekly();是直接执行了函数，把返回值赋值给onload，正确写法应该是传递函数引用：

window.onload = getWeekly; // 不带括号

但这个写法无法解决异步问题，必须配合方案1使用。

额外优化：给函数加数据判断 #

在getWeekly()开头加判断，避免数据未加载时执行无效逻辑：

function getWeekly() {
  dailyBtn.classList.remove("active");
  weeklyBtn.classList.add("active");
  monthlyBtn.classList.remove("active");
  
  // 数据未加载完成时直接返回
  if (Data.length === 0) return;
  
  // 下面的循环逻辑...
}

内容的提问来源于stack exchange，提问作者smiley-cat