setTimeout不允许我附加到innerHTML

Question

我怀疑应该责怪我的代码的setTimeout部分，但是我可以毫无问题地附加到DOM的document.body部分。 我究竟做错了什么？

 let adblock = document.getElementById(`adblock`); let fake_ad = document.createElement("div"); fake_ad.innerHTML = "&nbsp;"; // Hide it from viewport fake_ad.setAttribute("style", "top: -999px; position: fixed;"); // Add some Adblock bait classes fake_ad.className = "adsbox ad-300x250 banner-ad"; // Append the ad to DOM document.body.appendChild(fake_ad); // Wait 500ms for the adblocker to do its job window.setTimeout(function() { if (fake_ad.offsetHeight === 0) { // Add class .ab to body document.body.classList.add("ab"); // For testing console.log("Adblock is enabled!"); adblock.innerHTML = "present!"; document.body.innerHTML += "Adblock is enabled!"; } else { // For testing console.log("Adblock is disabled!"); document.body.innerHTML += "Adblock is disabled!"; } // Remove the fake ad from DOM document.body.removeChild(fake_ad); }, 500);

 <!DOCTYPE html> <html lang=en> <head> <title>test</title> </head> <body> <p>Adblocking is <strong id="adblock"></strong></p> </body> </html>

Answer 1

可能是，在setTimeout内部执行的代码是在垃圾回收周期删除了fake_ad之后执行的，因为任何活动函数都不会引用该代码。 您可以尝试将fake_ad变量传递给setTimeout调用，因此它具有防止蜜蜂收集垃圾的引用：

window.setTimeout(function(fake_ad) {
...
}, 500, fake_ad);

Answer 2

尝试包装您的JavaScript，以使其在窗口加载后运行。 如果您尝试预先操作DOM，则这些对象将不存在。

就像是：

window.addEventListener('load', function() {
  code block here...
}

或者，您可以从脚本标记中删除async ，并将其附加在结束<body>标记之后和结束<html>标记之前。

示例： https ： //jsfiddle.net/yLt6319m/2/

setTimeout不允许我附加到innerHTML

问题描述

2 个解决方案

解决方案1
0 2018-11-05 14:24:38

解决方案2
0 已采纳 2018-11-05 14:34:11

setTimeout不允许我附加到innerHTML

问题描述

2 个解决方案

解决方案1 0 2018-11-05 14:24:38

解决方案2 0 已采纳 2018-11-05 14:34:11

解决方案1
0 2018-11-05 14:24:38

解决方案2
0 已采纳 2018-11-05 14:34:11