9

我正在尝试将外部 JavaScript 文件动态加载到 HTML 元素中以预览广告代码。该脚本加载并执行，但该脚本包含“document.write”，该脚本执行正确但没有错误。

<html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
        <script type="text/javascript">
        $(function() {
            source = 'http://ib.adnxs.com/ttj?id=555281';

            // DOM Insert Approach
            // -----------------------------------
            var script = document.createElement('script');
                script.setAttribute('type', 'text/javascript');
                script.setAttribute('src', source);

            document.body.appendChild(script);
        });
        </script>
    </head>

<body>
</body>
</html>

如果我可以让它工作

  1. 如果我将源移动到同一个域进行测试
  2. 如果脚本被修改为使用 document.createElement 和 appendChild 而不是 document.write，就像上面的代码一样。

我无法修改脚本，因为它是由第三方生成和托管的。

有谁知道为什么 document.write 不能正常工作？有没有办法解决这个问题？

谢谢您的帮助！

4

4 回答 4

9

另一种解决方案是创建一个 iframe，然后在 ajax 调用准备好时将脚本加载到该 iframe 中：

var iframe = document.createElement('iframe');
document.body.appendChild(iframe);
var doc = iframe.contentWindow.document;

// do this whenever you want (f.ex after ajax is made):
doc.open();
doc.write('<script src="http://ib.adnxs.com/ttj?id=555281">\x3C/script>');
doc.close();

这样，document.write最终脚本不会影响您的网站，只会影响 iframe。您需要设置 iframe 的样式以适合广告。

于 2013-11-04T16:20:11.050 回答
1

如果外部脚本标签还包含document.write. 因此，我建议document.write您也可以使用：

document.write('\x3Cscript src="http://ib.adnxs.com/ttj?id=555281">\x3C/script>');

或者只是一个脚本标签（duh）：

<script src="http://ib.adnxs.com/ttj?id=555281"></script>
于 2013-11-04T15:53:18.873 回答
0

你不想打开（当 dom 准备好时document.write）$(function()

取下document .ready包装纸。

并将您的前移到前</body>。（或容器位置 - 您希望小部件出现的位置。）

所以 ：

<html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
    </head>

<body>

//bla bla...

<script type="text/javascript">

  (function (){

           var source = 'http://ib.adnxs.com/ttj?id=555281';

            // DOM Insert Approach
            // -----------------------------------
            var script = document.createElement('script');
                script.setAttribute('type', 'text/javascript');
                script.setAttribute('src', source);
                document.body.appendChild(script);
   })();

</script>
</body>
</html>

重要的 ：

在此处输入图像描述

于 2013-11-04T15:42:19.187 回答
0

我遇到了同样的问题并想出了一个解决方案。我认为我的有点复杂，因为我的布局是在客户端生成的，在 dom-ready 之后，这意味着我不能以这种方式渲染脚本。这为我增加了一个额外的步骤，但如果您的布局是在服务器端生成的，这对您来说可能不是额外的步骤。

  1. 生成您的网址。在您的情况下，它来自 ajax 请求，在我的情况下，它来自用户交互
  2. 使用此 URL 重新加载页面（可能使用新创建的表单将 URL 发布到服务器）

如果您能够将脚本包含在服务器上，就在它应该在的地方，那么您就完成了。否则：

  1. 在服务器端创建一个隐藏的 div，并具有特定的 ID。这将加载脚本 pre dom-ready 并正确触发 document.write。
  2. 抓取包含脚本的 div 的内容，您现在将 html 放在一个变量中，您可以将它放在页面的任何位置！
于 2014-12-08T01:22:12.850 回答