如何使用AJAX get方法获取存在二次加载的页面完整内容

方案1：固定时长延迟（你提到的5秒延迟方案） #

直接通过setTimeout将AJAX请求延后5秒触发，实现简单，代码如下：

// 延迟5000ms（5秒）发起GET请求
setTimeout(() => {
  const xhr = new XMLHttpRequest();
  const targetUrl = "https://pool.pm/addr1qy2465r5axxz92f0rlfyymz5zvsxad2v038slu70qeegm4aac2mvf8qqsgva9exmwhwpxymt896v5anudtr2wee77y6qgudr8k";
  xhr.open("GET", targetUrl, true);
  xhr.onload = function () {
    if (xhr.status >= 200 && xhr.status < 300) {
      // 处理获取到的完整页面内容
      console.log(xhr.responseText);
    }
  };
  xhr.send();
}, 5000);

注意：该方案容错率较低，网络环境较差时5秒可能不足以让页面完成所有动态内容加载，网络较好时又会产生无意义的等待时间

方案2：按加载状态触发（更可靠） #

针对目标页面有额外加载动画的特性，你可以通过轮询检测加载状态的方式，等所有内容加载完成后再发起请求，避免固定时长的弊端：

// 每300ms检测一次页面加载状态，最多等待30秒超时
const checkTimer = setInterval(() => {
  // 替换为目标页面实际加载动画的DOM选择器，判断加载动画是否消失
  const loadingElement = document.querySelector(".loading-animation");
  // 也可以替换为你需要获取的核心内容DOM的选择器，判断核心内容是否渲染完成
  // const targetContent = document.querySelector(".asset-list");

  if (!loadingElement /* || targetContent */) {
    clearInterval(checkTimer);
    // 加载完成后发起AJAX请求
    const xhr = new XMLHttpRequest();
    const targetUrl = "https://pool.pm/addr1qy2465r5axxz92f0rlfyymz5zvsxad2v038slu70qeegm4aac2mvf8qqsgva9exmwhwpxymt896v5anudtr2wee77y6qgudr8k";
    xhr.open("GET", targetUrl, true);
    xhr.onload = function () {
      if (xhr.status >= 200 && xhr.status < 300) {
        // 处理获取到的完整页面内容
        console.log(xhr.responseText);
      }
    };
    xhr.send();
  }
}, 300);

// 超时处理，30秒未加载完成则终止检测
setTimeout(() => {
  clearInterval(checkTimer);
  console.error("页面加载超时，请检查网络状态");
}, 30000);

额外注意事项 #

• 如果你的请求存在跨域问题，需要确保目标站点允许你的域名跨域访问，否则会触发CORS报错，这种场景建议通过后端代理转发请求
• 如果你使用的是jQuery的AJAX方法，只需要把请求逻辑放到对应的延迟/检测回调中即可，逻辑完全一致

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