动态引用 jQuery 库为什么不能加载了呢?

2017-05-16 14:10:18 +08:00
 rogwan

因为这个 module.js 文件依赖 jQuery 库,所以就在这个 module.js 中动态加载 jQuery (如果引用 module.js 的页面已经引用了 jQuery 就不加载,否则就加载 jQuery )。这个 module.js 里这样写为什么加载不了:

function loadJquery() {
 if(!(window.jQuery)) {
  var s = document.createElement('script');
  s.setAttribute('src', 'http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js');
  s.setAttribute('type', 'text/javascript');
  document.getElementsByTagName('head')[0].appendChild(s);
 }
}


$(document).ready(function () {    
    var module = ...
});

测试了下,这样 html 页面(本身没有引用 jQuery )引用 module.js 文件时,并没有提前加载 jQuery 库。

3319 次点击
所在节点    JavaScript
10 条回复
jarlyyn
2017-05-16 14:25:25 +08:00
为什么会加载?

你又没执行 loadJquery 函数……
rogwan
2017-05-16 14:54:11 +08:00
@jarlyyn 感谢,刚刚这段执行拷贝到外面去了,不过剪回来贴到 module.js 里面,还是也木有用啊?

loadJquery(
function() {
$(function(){ alert("loadjQuery succeeded"); })();
}
);
dont27
2017-05-16 14:59:36 +08:00
@rogwan = =原文主体 loadJquery 并没有声明以及使用函数参数,为什么你下面回复又带上了个函数参数(又不会执行到)……
joe1213
2017-05-16 15:03:43 +08:00
请复习一遍 javascript
jarlyyn
2017-05-16 15:07:19 +08:00
function loadJquery() {
if(!(window.jQuery)) {
var s = document.createElement('script');
s.setAttribute('src', 'http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js');
s.setAttribute('type', 'text/javascript');
document.getElementsByTagName('head')[0].appendChild(s);
}
}()

最后带一堆括号,表示执行
jarlyyn
2017-05-16 15:07:34 +08:00
一对
rogwan
2017-05-16 15:57:49 +08:00
@dont27
@jarlyyn

感谢建议,改了改问题还是老样子。后来考虑可能是添加到了不同的子节点,或者是加载顺序颠倒造成的?(就是 var module = ... 这部分加载太快,jquery 还没调用进来?不是很确定...);后来在外层指定了一个父节点 id,把两个 js 按顺序一起加载在同一个父节点 id 下面,就可以加载,module 部分也可以生效了。 到底因为什么问题,也还是不是很确定 =_=||
leadfast
2017-05-16 16:12:25 +08:00
https://gist.github.com/leadfast/f76b06b35071ecdd8da62491a3fc8e75
之前 v2er 做的自动签到,你可以看看里面 loadAndExecute 方法的实现
SakuraKuma
2017-05-16 17:06:13 +08:00
要不就直接调用,
要不就 IIFE。(function (){})();
milklee
2017-05-17 00:32:32 +08:00
function loadJquery (cb) {
if (!window.jQuery) {
var s = document.createElement('script')
s.src = 'http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js'
s.onload = cb
document.head.appendChild(s)
} else {
cb()
}
}

loadJquery(function () {
alert(typeof jQuery)
})

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/361677

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX