在doc上执行写入：除非已明确打开，否则无法从异步加载的外部脚本写入文档。

小编典典

在doc上执行写入：除非已明确打开，否则无法从异步加载的外部脚本写入文档。

javascript

我试图在页面加载执行后加载某个脚本，如下所示：

function downloadJSAtOnload(){
            var element = document.createElement("script");
            element.src = "scriptSrc";
            document.body.appendChild(element);
        }

         if (window.addEventListener)
                  window.addEventListener("load", downloadJSAtOnload, false);
            else if (window.attachEvent)
                  window.attachEvent("onload", downloadJSAtOnload);
            else window.onload = downloadJSAtOnload;

尽管此脚本似乎执行并下载了“ scriptSrc”，并将其附加在body标签末尾之前，但它在控制台（chrome）中产生了以下消息（不是错误）

无法在“文档”上执行“写入”：无法通过异步加载的外部脚本写入文档，除非已明确打开该文档。

这到底是什么意思？我应该做些不同的事情吗？即使我得到了预期的行为？

阅读 829

2020-04-25

共1个答案

小编典典

在文档完全解析并关闭后，异步加载的脚本可能会运行。因此，您不能document.write()在这样的脚本中使用（从技术上讲可以，但是它不会做您想要的事情）。

您将需要document.write()通过创建DOM元素，然后使用.appendChild()or
.insertBefore()或设置.innerHTML或某种直接DOM操作的机制将它们插入到特定的父级中，从而用显式DOM操作替换该脚本中的任何语句。

例如，代替内联脚本中的此类代码：

<div id="container">
<script>
document.write('<span style="color:red;">Hello</span>');
</script>
</div>

您可以使用它来替换上面的内联脚本，以动态加载脚本：

var container = document.getElementById("container");
var content = document.createElement("span");
content.style.color = "red";
content.innerHTML = "Hello";
container.appendChild(content);

或者，如果容器中没有需要附加的其他内容，则可以简单地执行以下操作：

var container = document.getElementById("container");
container.innerHTML = '<span style="color:red;">Hello</span>';

2020-04-25