Question

假设这两种方法都正确加载脚本，并且在使用脚本之前等待适当的时间（和/或使用回调），这些方法之间的主要区别是什么。

注意：我理解第一个使用jQuery（这是一个更大的下载等）。我真正感兴趣的是这些方法的影响。是否将脚本放在与另一个不同的范围内？等等。

jQuery的：

function loadScript() {
    $.getScript('http://www.mydomain/myscript.js');
}

附加到正文：

function loadScript() {
   var script= document.createElement('script');
   script.type= 'text/javascript';
   script.src= 'http://www.mydomain/myscript.js';
   script.async = true;
   document.body.appendChild(script);
}

追加头：

function loadScript() {
   var head= document.getElementsByTagName('head')[0];
   var script= document.createElement('script');
   script.type= 'text/javascript';
   script.src= 'http://www.mydomain/myscript.js';
   script.async = true;
   head.appendChild(script);
}

Answer 1

如果存在，jQuery会将script元素附加到head，否则会附加到document元素。引擎盖the code is similar。最终结果将是相同的：两种方法都在全局范围内执行新代码。

Answer 2

Jquery方法的文档说：

使用GET HTTP请求从服务器加载JavaScript文件，然后执行它。

这意味着导入的javascript将在成功加载后调用straigt。

附加到头部：这意味着浏览器将脚本标记添加为最后一个子项并执行内容（如果在head标记的末尾添加标记manuelly，则相同）。附加到正文：这意味着浏览器将脚本标记添加为正文标记的最后一个子标记并执行该内容（如果在正文标记的末尾添加标记manuelly，则相同）。

Answer 3

值得一提的是，jQuery的getScript函数默认禁用缓存，这意味着浏览器会在每次请求页面时下载脚本（请参阅上一个答案here）。另一方面，loadScript函数应该利用缓存。

jQuery getScript（）vs document.createElement（'script'）

3 个答案: