使用Marked.js渲染MD文件时遇输入参数为空错误求助

你的问题出在异步执行顺序上：fetch是异步网络请求，它的回调逻辑（给content赋值）要等请求完成后才会执行，但你同步写的marked.parse(content)会在fetch还没拿到数据时就运行，此时content还是初始的undefined，自然触发报错。

修正方法很简单，把渲染逻辑放到fetch的then链里，确保只有拿到MD内容后再调用marked：

const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);

let article = urlParams.get('key');
// 先判断是否拿到key参数，避免无效请求
if (!article) {
  document.getElementById("content").innerHTML = "<p>未指定要加载的文章</p>";
  return;
}
let pre = `https://mrchaoticx.github.io/Chaotic-Club/articles/${article}`;

let contentID = document.getElementById("content");
fetch(pre)
  .then(response => {
    // 增加请求错误判断
    if (!response.ok) {
      throw new Error(`请求失败：${response.status}`);
    }
    return response.text();
  })
  .then(data => {
    // 拿到数据后立即渲染
    contentID.innerHTML = marked.parse(data);
  })
  .catch(error => {
    // 处理请求失败的情况
    contentID.innerHTML = `<p>加载文章失败：${error.message}</p>`;
  });

额外优化点：

• 增加article参数校验，防止URL无key参数时发起无效请求
• 加入HTTP状态码检查，处理404、500这类请求失败场景
• 用catch捕获请求链的所有错误，避免页面静默崩溃

内容的提问来源于stack exchange，提问作者Mr Chaotic