jquery 引入在底部 $ready 就要用到$ 但页面还没加载 jquery 不用$ready 下面的 jq 代码就没办法运行

2016-10-21 11:00:46 +08:00
 IdJoel

我用了 js 的 window.onload = function(){}方法,虽然是好用的,但还是请问如何让 jq 在底部引用还可以在 jq 的引用上面使用$方法;

3354 次点击
所在节点    jQuery
18 条回复
IdJoel
2016-10-21 11:24:42 +08:00
是这个问题太简单没有人愿意回答吗?
halfcoder
2016-10-21 11:39:38 +08:00
是什么原因让你没法做到先引入 jquery 再使用$,我很好奇
qiayue
2016-10-21 11:43:16 +08:00
$(function(){
;;;;//code here
});
hansnow
2016-10-21 11:44:47 +08:00
在引入 jquery 之前就是没办法用$
starvedcat
2016-10-21 11:45:17 +08:00
无责任脑补一下:
jquery 引入在底部,$ready 就要用到$,但页面还没加载 jquery ,(但如果)不用$ready ,下面的 jq 代码就没办法运行
Trim21
2016-10-21 11:47:47 +08:00
为什么不能把引用放到上面或者代码放到下面?
oa414
2016-10-21 11:52:08 +08:00
jQuery 作为最基础的库应该在 head 标签里面阻塞地引入,然后 DOM 底部调用 $.ready 。

或者用模块加载器引入 jQuery, 并用模块加载器在 jQuery 加载完成之后执行 $.ready 部分代码 (估计你做的东西没有复杂到要这样做不可) 。

我猜你想在底部引入是为了让 DOM 内容加载更快,但是我觉得压缩+CDN 加载已经够快了,如果是移动端弱网环境,可以考虑内联 Zepto 。
IdJoel
2016-10-21 11:52:30 +08:00
@starvedcat 我就是你这么想的 无限死循环 我快死在这里面了
@qiayue 我试过了 也不好用 onload 都不行
@Trim21
@halfcoder
@hansnow
是 hexo 的模板里面把 jq 引到下面去了 我在页面中想写一段 demo 展示效果 我没改 hexo 的默认模板
IdJoel
2016-10-21 11:53:06 +08:00
@oa414 HEXO 的默认模板 jquery 引用就是在底部的。
hansnow
2016-10-21 11:55:14 +08:00
@IdJoel 那就在你加的代码前先引一下 jquery ,代码可以从底部复制,这样也不会增加太多负担
IdJoel
2016-10-21 11:58:54 +08:00
@hansnow 对于这种引两个 jq 的做法。。。我觉得我宁愿用 window.onload = function(){}..... 不过还是谢谢了~~
ChiangDi
2016-10-21 11:59:30 +08:00
你咋不上天
archey
2016-10-21 12:06:20 +08:00
在引入的 js 的 js 里面,在引入 jq 嘛,不想改模版的话
IdJoel
2016-10-21 13:05:07 +08:00
@ChiangDi 有这个想法,请问提供飞船吗。
m939594960
2016-10-21 13:06:17 +08:00
setInterval(function (){
if(typeof jQuery == 'undefined'){
console.log('没加载 jquery')
}else{
console.log('js 加载好了 请写你的逻辑')
}
},1000)
m939594960
2016-10-21 13:06:36 +08:00
```js
setInterval(function (){
if(typeof jQuery == 'undefined'){
console.log('没加载 jquery')
}else{
console.log('js 加载好了 请写你的逻辑')
}
},1000)
```
HaEx
2016-10-21 17:07:13 +08:00
不错
SoloCompany
2016-10-22 02:00:05 +08:00
<script>
var yourBootstrapFunction = function() {
$("p").text("The DOM is now loaded and can be manipulated.");
};
</script>

html here
<p>Not loaded yet.</p>

<script src="jquery.js"></script>
<script> $(document ).ready(yourBootstrapFunction); </script>

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

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

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

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

© 2021 V2EX