Question

我正在尝试以编程方式插入js文件，使用jquery和类似的东西：

var script = document.createElement( 'script' );
script.type = 'text/javascript';
script.src = 'http://someurl/test.js';
$('body').append(script);

它工作正常，如果test.js包含alert或一些简单的代码，它工作正常，但如果文件test.js包含document.write，并且包含js的文件托管在另一个上域名比test.js（或localhost），没有任何反应，firebug显示错误：

从异步加载的外部调用document.write（）脚本被忽略了。

如果test.js和包含它的文件托管在同一个域上，在chrome上它仍然无法正常工作，但在Firefox上document.write执行正常，但页面永远保持“加载”并且嗅探显示请求所有处于“待定”状态的文件。

我可以尝试以编程方式包含js文件的其他方法吗？

Answer 1

使用innerHTML而不是document,write。

并使用以下代码注册脚本，

(function() {
    var jq = document.createElement('script');
    jq.type = 'text/javascript';
    jq.async = true;
    jq.src = 'http://someurl/test.js';
    var s = document.body.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(jq, s);
})();

Answer 2

Document.write仅适用于加载html时的同步任务（第一次），永远不会用于您尝试执行的异步任务。

Answer 3

您要做的是将<script> DOM元素动态插入HEAD元素。我有这个脚本坐着。举个例子，这是一个竞争条件，但你明白了。使用网址呼叫load_js。这是针对许多现代API完成的，它是您跨域JavaScript的最佳朋友。

<html>
    <head>
        <script>
            var load_js = function(data, callback)
            {
                    var head = document.getElementsByTagName("head")[0];

                    var script = document.createElement("script");
                    script.type = "text/javascript";
                    script.src = data;
                    head.appendChild(script);

                    if(callback != undefined)
                            callback();
            }

            load_js("http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js");

            setTimeout(function() {
                $('body').html('loaded');
            }, 1000);
        </script>
    </head>

    <body></body>
</html>

Answer 4

您插入JavaScript的方法没有任何问题。 document.write只是糟透了。它仅用于同步任务，因此将document.write放在单独的脚本文件中会遇到麻烦。无论如何，人们都这样做。我经常看到的解决方案是覆盖document.write。

如果使用document.write，则无法以编程方式插入js

4 个答案: