javascript - 使用 RequireJS 模块时出现 "document.write"问题

Question

我有一个模块需要执行 document.write 操作，以便在页面加载后打印横幅。

如果我使用老式方式执行此操作，则不会遇到任何问题。 横幅打印在 div 内。

<div id="banner">
    <script> addAdvert() </script>
</div>

<script>
function addAdvert(){
  srcScript = 'http://www.urltoscript.js';
  document.write('<script type=\"text/javascript\" src=\"'+srcScript+'" ><\/script>');
}
</script>

但是如果我使用 require js 模块(类似这样)尝试这个:

addAvert: function() {
             var srcScript = options.urltoScript
             document.write('<script type=\"text/javascript\" src=\"'+srcScript+'" ><\/script>');
}

它执行 document.write 并渲染所有文档，仅在整个文档上打印横幅...

我尝试过这个替代方案:

addAvert: function() {
    var srcScript = options.urltoScript

          var bsa = document.createElement('script');
             bsa.type = 'text/javascript';
             bsa.async = true;
             bsa.src = srcScript;
             $("#banner").append(bsa);
 }

Answer 1

根据您的评论判断，您尝试从虚构的 URL http://www.urltoscript.js 加载的脚本也使用 document.js 。写。您应该更改此脚本以不使用 document.write，或者您应该放弃异步加载它的想法，因为 document.write 在调用时无法可靠地工作异步。

当您尝试 require([bsa.src]) (正如您在评论中提到的)时，您已经发现无法从异步加载的脚本。 (另请注意，仅执行 require([bsa.src]) 是行不通的，除非另一端的源代码是 AMD 模块或者您定义了 shim 对于它。)

您第一次尝试通过 RequireJS 加载并没有产生有关异步加载 document.write 的错误消息，因为加载它的 script 元素不是本身异步。然而，它完全清空了你的页面。这是因为，如果您在页面加载完成后调用 document.write，浏览器可能会隐式调用 document.open这可能会使您的页面空白。

这里的结果是您无法可靠地将 document.write 与异步代码一起使用。