Google Chrome 扩展程序如何等待页面完全加载（加载屏幕）答案

【问题标题】：Google Chrome Extension How to wait for page to be loaded completely (loading screen)Google Chrome 扩展程序如何等待页面完全加载（加载屏幕）
【发布时间】：2018-03-31 07:04:02
【问题描述】：

我的 chrome 扩展正在尝试在页面上使用 CSS 选择器来抓取某些元素。我遇到了一个问题，在我的脚本执行时，在 changeInfo.status 已经“完成”之后加载异常/连续加载元素的网站上，它不会从尚未加载的部分获取信息。这方面的一个例子是具有加载屏幕的网站和具有多个框架的网站。一个可能的解决方案是让用户单击一个按钮来执行脚本，但我想知道是否有其他方法可以告诉我的脚本等待页面完全加载，以便它可以自动提取信息。我想要一个替代解决方案，而不是将 allFrames 设置为 true，因为它不适用于所有有此问题的网站，我也发现我的脚本没有必要在它遇到的每个帧上运行。我也尝试过等待加载事件，但这对我不起作用。

【问题讨论】：

标签： javascript google-chrome google-chrome-extension

【解决方案1】：

因为 load 事件会在动态内容加载之前触发，所以您将无法使用它。如果您没有挂钩内容加载并且想要更“自动化”的东西，您可以使用递归超时功能并定期检查所需的内容以加载并在内容存在时采取行动。

function timeoutFunction() {
  var inputVal = document.getElementById("checkThis").value;
  console.log(inputVal);
  if (inputVal !== "STOP") {
    setTimeout(timeoutFunction, 3000);
    console.log("Keyword not found.");
  } else {
    console.log("Keyword found.");
  }
}

$(function(){setTimeout(timeoutFunction, 3000)});

<span>The function will check every three seconds for the value of this input to be "STOP"</span>
<input id="checkThis">

【讨论】：

我使用的是香草 javascript，但我理解其中的逻辑。有没有不涉及不断检查信息的方法？因为有些值在大多数网页上始终不会出现，并且让它无限期运行似乎很奇怪。如果没有，我相信我可以为超时添加一个计数器，并在一定次数的超时后结束。
它不会无限期地运行。一旦加载了您要查找的信息，递归过程就会停止。
找不到信息会不会？我想说的是，即使页面已完全加载，有时我要查找的信息也不存在。
是的，这就是为什么在我提供的示例中，计时器仅在所需内容不存在时才会运行。一旦出现所需的内容，该过程就结束了。