极客观点
项目管理
HarmonyOS
$(document).ready(function() {
});$(window).ready(function () {
});$(window).load(function() {
});$(window).on('load', function () {
});$(function() {
});(function($) {
})(jQuery);想問一下要用哪個才對？還是有其他更好的？
以及使用的時間點？
另外我發現我把這個拔下來，js代碼還是可以運行...所以是要在什麼樣的情況下才需要使用？
再來就是看哪個最通用？
補充
我有很多js檔
每一個可能是 fucntion (){}, click, submit 等等
這樣每一個都要 $(function(){ 嗎？
又發現了一個
jQuery(document).ready(function ($) {補充
我發現有時候不能用這個 function 耶
像我有一個檔案全部都是 function 的
我用了之後導致不能用
$(function(){
})
是
$(document).ready(function() {
});
的简写方式
ready 是 DOM 树可操作时的回调, 先于 onload
所以你只管尽情使用$(function(){})吧
jQuery = function( selector, context ) {
return new jQuery.fn.init( selector, context );
},init = jQuery.fn.init = function( selector, context, root ) {
var match, elem;
// HANDLE: $(""), $(null), $(undefined), $(false)
if ( !selector ) {
return this;
}
// Method init() accepts an alternate rootjQuery
// so migrate can support jQuery.sub (gh-2101)
root = root || rootjQuery;
// Handle HTML strings
if ( typeof selector === "string" ) {
...
// HANDLE: $(expr, $(...))
} else if ( !context || context.jquery ) {
return ( context || root ).find( selector );
// HANDLE: $(expr, context)
// (which is just equivalent to: $(context).find(expr)
} else {
return this.constructor( context ).find( selector );
}
// HANDLE: $(DOMElement)
} else if ( selector.nodeType ) {
this[ 0 ] = selector;
this.length = 1;
return this;
// HANDLE: $(function)
// Shortcut for document ready
} else if ( isFunction( selector ) ) {
return root.ready !== undefined ?
root.ready( selector ) :
// Execute immediately if ready is not present
selector( jQuery );
}
return jQuery.makeArray( selector, this );
};上源码
$(document).ready(function() {});
$(window).ready(function () {});
**自己理解下document和window的区别
再或者你想想 JQ的写法，到了原生JS怎么写**
$(window).load(function() {});
$(window).on('load', function () {});
addEventListener
$(function() {});
等同于 window.onload
(function($) {})(jQuery);
跟上面区别大了，这是封闭空间，解决变量冲突等问题
封闭空间传送门
10 回答11.3k 阅读
5 回答4.9k 阅读✓ 已解决
4 回答3.2k 阅读✓ 已解决
2 回答2.8k 阅读✓ 已解决
3 回答2.4k 阅读✓ 已解决
3 回答2.2k 阅读✓ 已解决
2 回答2.7k 阅读✓ 已解决
回答之前，先来点背景知识
假设有一个html网页，它的dom结构如下
整个页面加载过程
正式回答
$(document).ready,$(window).ready，$(function() {})无差别：他们是在上面第一步中js全部加载完毕后执行，此时页面的图片可能还没展示出来。
$(window).load和$(window).on('load'无差别：他们在上面背景知识中 所有资源都加载完毕后，图片此时已经展示出来，才被触发。
一般ready早于load触发。
如果你写的js不依赖于图片尺寸，那么完全可以放在ready中去执行。
如果你写的js计算元素位置或大小时，要受图片大小影响，那么必须放在load中执行。
最后那个
(function($) {})(jQuery);只是先定义一个函数，参数是$, 然后把jQuery对象作为参数传给它而已，与上面的ready,load不是一件事情，没有可比性。它相当于有的公司可能自己写了专有库，里面也用
$作为方法引用，一旦同时引入jQuery，两个$就冲突了。 开发人员又不想改变使用$的默认习惯，于是将脚本写到一个函数中，在这个作用域内的$表示的是jQuery或者是其它库，完全由传入的参数决定。