Firefox开发者工具已禁用缓存，但Ajax+innerHTML加载的内嵌JS仍缓存，如何强制刷新？

这种内嵌JS被缓存的情况确实挺闹心的——明明已经在开发者工具里关了缓存，结果动态加载的脚本还是老版本，非得重启浏览器才行。结合你的需求（不想把十几行内嵌JS抽成单独文件），给你几个实用的解决办法：

• 给Ajax请求加缓存破击参数
  这是最直接的办法，本质是让每次请求的URL都不一样，彻底绕开浏览器的缓存机制。在你发起Ajax请求的URL后面拼接一个时间戳或者随机数，比如：

  const url = 'your-second-page.html?t=' + Date.now();
  // 然后用这个url发起Ajax请求
  

  这样浏览器会把每次请求都当成新资源，不会复用缓存的HTML（包括里面的内嵌JS），完全不用动你的内嵌代码。

• 手动清理Firefox临时缓存（无需重启）
  有时候开发者工具的「禁用缓存」选项可能没覆盖到所有缓存场景，你可以手动清理一下当前会话的缓存：按Ctrl+Shift+Delete（Windows）或Cmd+Shift+Delete（Mac），在弹出的窗口里只勾选「缓存」，然后点击「立即清理」，再刷新页面就行——比重启浏览器方便太多。

• 手动提取并重新执行内嵌JS
  如果上面的方法还是不管用，可能是浏览器对通过innerHTML插入的脚本有特殊的解析缓存。你可以在Ajax拿到HTML内容后，手动提取出<script>标签里的代码，然后创建新的<script>元素插入页面，强制浏览器重新执行：

  // 假设ajaxResponse是你拿到的HTML字符串
  const scriptMatch = ajaxResponse.match(/<script>([\s\S]*?)<\/script>/);
  if (scriptMatch) {
    const scriptContent = scriptMatch[1];
    const scriptEl = document.createElement('script');
    scriptEl.textContent = scriptContent;
    document.getElementById('your-container-div').appendChild(scriptEl);
  }
  

  这个方法也不用把内嵌JS抽成单独文件，只是多了一步提取和重新插入的操作。

• 检查服务器的HTTP缓存头
  有时候问题出在服务器那边——如果你的第二个HTML文件被设置了强缓存头（比如Cache-Control: max-age=3600），即使浏览器端禁用了缓存，可能还是会优先读取本地缓存。你可以在开发者工具的「网络」面板里查看这个HTML请求的响应头，如果有这类缓存设置，临时在开发环境下把服务器的缓存配置改成Cache-Control: no-cache, no-store，就能彻底禁用缓存了。

这些方法都能帮你绕过缓存，不用动那十几行内嵌JS的结构，应该能解决你的问题~

备注：内容来源于stack exchange，提问作者toomanylogins