11

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

注意：我了解第一次使用 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);
}
4

3 回答 3

5

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

于 2011-04-26T14:29:05.360 回答
2

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

于 2014-05-11T19:50:39.963 回答
2

Jquery 方法的文档说：

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

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

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

于 2011-04-26T14:35:30.303 回答