Javascript 不使用document.write将文件插入头标签中的特定位置

这可能是不可能的，但值得一问。我正在动态地将脚本标记插入页面的

头部
部分。目前，我正在使用
文档。写下许多人都不喜欢的
，但它确实能很好地完成工作

然而，出于上述原因，我想找到一种替代
document.write
的方法

因此，我需要一个函数来实现这一点：




//此处的代码使用动态插入脚本中的代码


任何人都可以建议使用jQuery或纯javascript在页面上插入元素，但同时满足以下要求：

将元素放置在调用函数的点处。e、 g.脚本标记放在调用它的脚本标记之后
脚本以同步方式加载，因此会阻止其他脚本，直到完成为止
谷歌用他们的
Google.load（）
方法做到这一点，他们使用document.write吗？当然不是…
你可以看看这篇文章-
facebook使用类似的脚本异步加载SDK

它是跨浏览器的，可以异步加载脚本，即使页面上的html无效（即使缺少head/body标记）

下面是一个直接来自facebook SDK的示例：

  (function(d, debug){
     var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
     if (d.getElementById(id)) {return;}
     js = d.createElement('script'); js.id = id; js.async = true;
     js.src = "//connect.facebook.net/en_US/all" + (debug ? "/debug" : "") + ".js";
     ref.parentNode.insertBefore(js, ref);
   }(document, /*debug*/ false));

您必须进行一些修改，因为它允许您只加载一次脚本（因为
if（d.getElementById（id））{return；}
）

如果我们仔细观察脚本，我们可以看到许多好处：


在你的页面上，你只需要有一个
script
标签（因为异步加载的脚本），这就是为什么它会得到第一个script元素
它查找已添加的SDK
它创建具有指定id的新脚本元素
它设置脚本的
src
它将脚本元素插入到特定位置
它异步加载脚本，以防止页面阻塞
自调用函数为文档对象创建短别名。这使脚本更加紧凑
你可以看看这篇文章-
facebook使用类似的脚本异步加载SDK

它是跨浏览器的，可以异步加载脚本，即使页面上的html无效（即使缺少head/body标记）

下面是一个直接来自facebook SDK的示例：

  (function(d, debug){
     var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
     if (d.getElementById(id)) {return;}
     js = d.createElement('script'); js.id = id; js.async = true;
     js.src = "//connect.facebook.net/en_US/all" + (debug ? "/debug" : "") + ".js";
     ref.parentNode.insertBefore(js, ref);
   }(document, /*debug*/ false));

您必须进行一些修改，因为它允许您只加载一次脚本（因为
if（d.getElementById（id））{return；}
）

如果我们仔细观察脚本，我们可以看到许多好处：


在你的页面上，你只需要有一个
script
标签（因为异步加载的脚本），这就是为什么它会得到第一个script元素
它查找已添加的SDK
它创建具有指定id的新脚本元素
它设置脚本的
src
它将脚本元素插入到特定位置
它异步加载脚本，以防止页面阻塞
自调用函数为文档对象创建短别名。这使脚本更加紧凑
你可以用不同的方法来做。正如在这里的各种回答中提到的。
但是我用下面的方法

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");

你可以用不同的方法。正如在这里的各种回答中提到的。
但是我用下面的方法

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");

这是我在使用
document.write
之前使用的方法，出于某种原因，这不会阻止它之后的脚本运行。无论如何，谢谢：-）我的代码与我最初从你的链接答案中得到的代码完全相同！这是我在使用
document.write
之前使用的方法，出于某种原因，这不会阻止它之后的脚本运行。无论如何，谢谢：-）我的代码与我最初从你的链接答案中得到的代码完全相同！