javascript - 在 Javascript 文件中加载并执行 jQuery

Question

我的问题类似于this one 。但我觉得答案不完整，问题的结尾也没有不确定性......

我正在开发一个 Javascript 应用程序，供我的用户放置在他们的网站上。我只希望他们必须将一个 javascript 包含在其网页顶部才能使用我的应用程序。

我的 JavaScript 需要 jQuery 才能运行。

所以我们的目标是......

1. 检查 jQuery 是否已加载。
2. 如果尚未加载 jQuery，则加载它。
3. 执行需要 jQuery 才能运行的 javascript。

我想在同一个脚本中完成上述三件事。

这是我最初尝试过的...

function loa_j(){
 if (typeof jQuery === "undefined") {
 var newscript = document.createElement('script');
 newscript.type = 'text/javascript';
 newscript.async = true;
 newscript.src = 'http://code.jquery.com/jquery-latest.min.js';
 (document.getElementsByTagName('head')[0]||document.getElementsByTagName('body')[0]).appendChild(newscript);
 }
}

loa_j();
$(document).ready(function(){
//...Code That Never Fired
}

这不起作用，因为 javascript 不会等待 jQuery 加载。它确实加载了 jQuery，只是不够快。

这是我的另一种解决方案，这个有效，但我挠头想知道这是否真的是最好的方法......

function loa_j(){
if (typeof jQuery === "undefined") {
(function(a,b){function G(a){var b=F[a]={.... //Entire jQuery copy and pasted in :D
}
}

因此，通过将整个 jQuery 复制并粘贴到该函数中，代码实际上可以工作。

这真的是最好的方法吗？

Answer 1

您可以将 onload 事件添加到动态加载的脚本中，如下所示:

function loa_j(){
 if (typeof jQuery === "undefined") {
     var newscript = document.createElement('script');
     newscript.type = 'text/javascript';
     newscript.async = true;
     newscript.src = 'http://code.jquery.com/jquery-latest.min.js';
     newscript.onload = jqReady;  //<-- executed only after jquery is loaded
     (document.getElementsByTagName('head')[0]||document.getElementsByTagName('body'[0]).appendChild(newscript);
  }
}

function jqReady(){
    // your jquery code here 
}

loa_j();