我需要帮助来放置一个函数，以便我的代码在 DOM 渲染后运行 [重复]答案

【问题标题】：I need help to place a function so my code runs after the DOM has been rendered [duplicate]我需要帮助来放置一个函数，以便我的代码在 DOM 渲染后运行 [重复]
【发布时间】：2019-07-01 12:33:07
【问题描述】：

我有一行代码比 DOM 运行得更快，所以我需要一个超时函数，但我不知道该放在哪里。

function testing() {
  var newHeadline = document.createElement("h1");
  newHeadline.textContent = "Headline";

  document.getElementsByClassName("col-sm")[0].insertBefore(newHeadline, document.getElementsByClassName("text-content")[0]);
  for (var a = 0; a < 10; a++) {
    if (document.getElementsByClassName("form-control")[0] != undefined) {
      document.getElementsByClassName("form-control")[0].parentElement.remove();


      return true
    }
  }
}

【问题讨论】：

标签： javascript

【解决方案1】：

使用 window.onload。 window.onload 确保首先加载窗口中的所有内容，包括脚本和图像，然后在加载完所有内容后调用提供的函数。

window.onload=function testing() {


  var newHeadline = document.createElement("h1");
  newHeadline.textContent = "Headline";

  document.getElementsByClassName("col-sm")[0].insertBefore(newHeadline, document.getElementsByClassName("text-content")[0]);
  for (var a = 0; a < 10; a++) {
    if (document.getElementsByClassName("form-control")[0] != undefined) {
      document.getElementsByClassName("form-control")[0].parentElement.remove();


      return true

    }


  }
}

【讨论】：

【解决方案2】：

如果您想等到所有 HTML 都已加载并解析完 JavaScript，请使用 DOMContentLoaded 事件；如果您还想等到所有图像和样式都已应用，请使用 load 事件。

if (document.readyState === "complete") testing();
else addEventListener("DOMContentLoaded", testing);

或

if (document.readyState === "complete") testing();
else addEventListener("load", testing);

您也可以使用空的timeout，在脚本被解析并运行后立即运行函数。

setTimeout(testing, 0);

【讨论】：