jQuery中的 $(window) load()与$(document) ready()以及jquery $(document) ready() 与window onload 的区别

左手的ㄟ右手 2023-10-18 15:45 9阅读 0赞

**目录**

1：document.ready和onload的区别——JavaScript文档加载完成事件页面加载完成有两种事件

2：$(function()和$(document).ready(function()和$().ready(function()

3：document.ready和onload的区别

1.$(window).load(function()\{...\}方法

⑴执行时机:

⑵多次使用:

2.$(document).ready()方法

⑴执行时机:

⑵多次使用:

--------------------

注：一般情况先一个页面响应加载的顺序是：域名解析-加载html-加载js和css-加载图片等其他信息。

# 1：document.ready和onload的区别——JavaScript文档加载完成事件   页面加载完成有两种事件 #

一是ready，表示文档结构已经加载完成（不包含图片等非文字媒体文件）  
二是onload，指示页面包含图片等文件在内的所有元素都加载完成。

# 2：$(function()和$(document).ready(function()和$().ready(function() #

用jQ的人很多人都是这么开始写脚本的：  
$(function()\{  
// do something  
\});  
其实这个就是jq ready()的简写，他等价于：

$(document).ready(function()\{  
//do something  
\})  
//或者等价于下面这个方法，jQuer的默认参数是：“document”；

$().ready(function()\{  
//do something  
\})

这个就是jq ready()的方法就是Dom Ready，他的作用或者意义就是:在DOM加载完成后就可以可以对DOM进行操作。

那么Dom Ready应该在“加载js和css”和“加载图片等其他信息”之间，就可以操作Dom了。

# 3：document.ready和onload的区别 #

## 1.$(window).load(function()\{...\}方法 ##

###    ⑴执行时机: ###

在网页中所有元素(包括元素的所有关联文件)完全加载到浏览器后才执行，即JavaScript 此时可以访问网页中的所有元素。  
window.οnlοad=function()\{  
//原生js  
\}

$(window).load(function()\{

//jquery的window.load

\}）；

###       ⑵多次使用: ###

JavaScript的onload事件一次只能保存对一个函数的引用，他会自动用最后面的函数覆盖前面的函数。  
function one()\{

alert("one");

\}

function two()\{

alert("two");

\}

window.οnlοad=one;

window.οnlοad=two;

//运行代码后只有 two

## 2.$(document).ready()方法 ##

###       ⑴执行时机: ###

在DOM完全就绪时就可以被调用。(这并不意味着这些元素关联的文件都已经下载完毕)  
举个例子:$(document).ready()方法明知要DOM就绪就可以操作了，不需要等待所有图片下载完毕。

###    ⑵多次使用: ###

function one()\{

alert("one");

\}

function two()\{

alert("two");

\}

$(document).ready(function()\{

one();

\});

$(document).ready(function()\{

two();

\});

//运行代码后

//先是：one

//先是：two

发表评论取消回复

表情：

评论列表（有 0 条评论，9人围观）

还没有评论，来说两句吧...

相关阅读

相关 $(document).ready() 与window.onload的区别

Jquery中$(document).ready()的作用类似于传统JavaScript中的window.onload方法，不过与window.onload方法还是有区别的。

清疚/ 2024年02月17日 15:53/ 0 赞/ 42 阅读

相关 jQuery中的 $(window) load()与$(document) ready()以及jquery $(document) ready() 与window onload 的区别

目录 1：document.ready和onload的区别——JavaScript文档加载完成事件页面加载完成有两种事件 2：$(function()和$(document

左手的ㄟ右手/ 2023年10月18日 15:45/ 0 赞/ 10 阅读

相关 jQuery中的$(window).load()与$(document).ready()

大多数jQuery实例或教程都告诉我们绑定我们的jQuery代码到$(document).ready事件。虽然$(document).ready 事件在大多数情况下都O

女爷i/ 2023年10月17日 10:51/ 0 赞/ 35 阅读

相关 jquery $(document).ready() 与window.onload的区别

1.执行时间 window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。 $(document).ready()是DO

「爱情、让人受尽委屈。」/ 2022年09月18日 14:56/ 0 赞/ 132 阅读

相关 Jquery中的$(document).ready()和window.onload的区别

Jquery中$(document).ready()的作用类似于传统JavaScript中的window.onload方法，不过与window.onload方法还是有区别的。

╰半橙微兮°/ 2022年08月27日 04:45/ 0 赞/ 191 阅读

相关 $(document).ready()与window.onload的区别

jQuery提供了ready()方法，用来代替javascript核心的window.onload，事件通常与DOM的文档对象绑定。而ready()方法的参数是一个函数

朱雀/ 2022年07月14日 04:57/ 0 赞/ 158 阅读

相关 $(document).ready()与window.onload的区别

执行时间不同 $(document).ready()是在浏览器已经解析完整个html文档，dom树已经建立起来，但像图片等资源文件还没有加载之前的时候执行的。 wind

Bertha 。/ 2022年06月14日 12:20/ 0 赞/ 190 阅读

相关 window.onload与document.ready()的区别

Jquery中$(document).ready()的作用类似于传统JavaScript中的window.onload方法，不过与window.onload方法还是有区别的。

爱被打了一巴掌/ 2022年06月08日 14:20/ 0 赞/ 216 阅读

相关 jquery $(document).ready()与window.onload的区别

jquery $(document).ready()与window.onload()功能相似，但是还是有区别： 1、执行时间不同： window.onload必须

谁践踏了优雅/ 2022年06月07日 05:20/ 0 赞/ 154 阅读

相关 $(document) .ready()与window. onload的区别

JQuery中$(document).ready()的作用类似于传统JavaScript中的window.onload方法，不过与window.onload方法还是有

缺乏、安全感/ 2021年12月14日 10:13/ 0 赞/ 301 阅读