jQuery - $(document)之间有什么区别。准备好$(window).load?

有什么不同

$(document).ready(function(){
//my code here
});

而且

$(window).load(function(){
//my code here
});

我想确保:

$(document).ready(function(){


})

而且

$(function(){


});

而且

jQuery(document).ready(function(){


});

都是一样的。

你能告诉我它们之间有什么异同吗?

325172 次浏览

jQuery API文档

而JavaScript提供了load事件来执行代码时,a 页被呈现时,此事件直到所有资产都被触发 等图像已完全接收。在大多数情况下, 脚本可以在DOM层次结构完全完成后立即运行 构造。传递给.ready()的处理程序保证为 在DOM准备好之后执行,所以这通常是最好的位置 附加所有其他事件处理程序和运行其他jQuery代码。当使用 依赖于CSS样式属性值的脚本,这很重要 之前引用外部样式表或嵌入样式元素

. xml

在代码依赖于加载资产的情况下(例如,如果 尺寸的图像是必需的),代码应放在一个 而不是load事件的处理程序


第二个问题的答案是

不,只要你不是在无冲突模式下使用jQuery,它们是相同的。

$(document).ready(function() {
// executes when HTML-Document is loaded and DOM is ready
console.log("document is ready");
});




$(window).load(function() {
// executes when complete page is fully loaded, including all frames, objects and images
console.log("window is loaded");
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Query 3.0 version

Breaking change: .load(), .unload(), and .error() removed

These methods are shortcuts for event operations, but had several API limitations. The event .load() method conflicted with the ajax .load() method. The .error() method could not be used with window.onerror because of the way the DOM method is defined. If you need to attach events by these names, use the .on() method, e.g. change $("img").load(fn) to $(img).on("load", fn).1

$(window).load(function() {});

应改为

$(window).on('load', function (e) {})

这些都是等价的:

$(function(){
});


jQuery(document).ready(function(){
});


$(document).ready(function(){
});


$(document).on('ready', function(){
})
document.ready是一个jQuery事件,它在DOM准备好时运行,例如,所有的元素都在那里可以找到/使用,但不一定是所有的内容。< br > 当图像等加载时,window.onload稍后触发(或在最坏/失败的情况下同时触发)。例如,如果你使用图像尺寸,你通常会使用这个。

也读一个相关的问题:
$(window).load()和$(document).ready()函数之间的区别 < / p >

这三个功能是相同的:

$(document).ready(function(){


})

而且

$(function(){


});

而且

jQuery(document).ready(function(){


});

这里$用于定义jQuery,如$ = jQuery

不同之处在于

  • $(document).ready是在加载DOM时触发的jQuery事件,因此它在文档结构准备好时触发。
  • $(window).load事件在整个内容加载后触发,如页面包含图像,css等。

ready事件总是在唯一的html页面加载到浏览器和函数执行....时执行 但是加载事件是在页面.....的所有页面内容加载到浏览器时执行的 我们可以在jQuery脚本中使用noconflict()方法时使用$或jQuery

$(document).ready()$(window).load()函数的区别在于,$(window).load()中包含的代码将在整个页面(图像,iframes,样式表等)加载后运行,而文件准备好了事件在所有图像,iframes等加载之前触发,但在整个DOM本身准备就绪之后。


$(document).ready(function(){


})

而且

$(function(){


});

而且

jQuery(document).ready(function(){


});

以上3个代码没有区别。

它们是等价的,但是如果任何其他JavaScript框架使用相同的美元符号作为快捷方式名,你可能会面临冲突。

jQuery.noConflict();
jQuery.ready(function($){
//Code using $ as alias to jQuery
});
$(document).ready(function(e) {
// executes when HTML-Document is loaded and DOM is ready
console.log("page is loading now");
});


$(document).load(function(e) {
//when html page complete loaded
console.log("completely loaded");
});

(窗口).load美元是一个事件,当DOM和页面上的所有内容(所有内容)如CSS、图像和帧完全加载时触发。一个最好的例子是,如果我们想要得到实际的图像大小或任何细节,我们使用它。

$ (document)时()表示其中的代码需要在DOM加载并准备由脚本操作时执行。它不会等待图像加载后执行jQuery脚本。

<script type = "text/javascript">
//$(window).load was deprecated in 1.8, and removed in jquery 3.0
// $(window).load(function() {
//     alert("$(window).load fired");
// });


$(document).ready(function() {
alert("$(document).ready fired");
});
</script>

美元(窗口)。在$(document).ready()之后加载。

$(document).ready(function(){


})
//and
$(function(){


});
//and
jQuery(document).ready(function(){


});

以上3个是一样的,$是jQuery的别名,如果其他JavaScript框架使用相同的$符号,你可能会面临冲突。如果遇到冲突,jQuery团队提供解决方案无用的阅读更多。

美元(窗口)。Load在1.8中已弃用,在jquery 3.0中被移除