大多数情况下,jquery
代码的编写,都要求我们将jquery的代码放在
$(document).ready(function(){
........jquery代码...........
});
上面的代码和
$().ready(function(){
........jquery代码...........
});
$(function(){ ........jquery代码........... });
是等同的~~最后一种方式是最简洁的方式,绝大多数情况下我都使用最后一种写法,呵呵~~好记!
注意:
有时候我们自己编写的jquery代码出现莫名其妙的问题,看似正常的代码,但是就是在运行的时候出错了,那么请先检查一下你的代码有没有放在$(document).ready()方法中运行。
接下来我们来说说$(document).ready()方法和window.onload方法的区别:
他们的主要的区别有两点:
1、执行时机
window.onload方法是在网页中的所有的元素(包括元素的所有关联文件)都完全加载到浏览器之后才执行。而通过jQuery中
的$(document).ready()方法注册的事件处理程序,只要在DOM完全就绪时,就可以调用了,比如一张图片只要<img>标签
完成,不用等这个图片加载完成,就可以设置图片的宽高的属性或样式等。
2、绑定结果
$(document).ready()方法可以多次使用而注册不同的事件处理程序,而window.onload一次只能保存对一个函数的引用,多次绑定函数只会覆盖前面的函数。
先来看window.onload方法在一个页面上注册两次会是什么样的结果:
function one(){
alert("one");
}
function two(){
alert("two");
}
window.onload = function(){two();}
window.onload = function(){one();}
上面的代码运行后,会弹出“one”。
再来看看$(document).ready()方法分两次调用会是什么结果。
function one(){
alert("one");
}
function two(){
alert("two");
}
$(document).ready(function(){
one();
});
$(document).ready(function(){
two();
});
上面的代码运行后,会分别弹出“one”和“two”。
分享到:
相关推荐
(JQuery-- onload,ready方法详细解说
window.onload与$(function(){})区别包括页面所有的图片加载完成才会回调(晚)只能有一个监听回调页面加载完成就回调(早)可以有多个监听。
页面加载完成有两种事件,一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件),二是onload,指示页 面包含图片等文件在内的所有元素都加载完成。(可以说:ready 在onload 前加载!!!) 一般样式...
主要介绍了页面加载与js函数的执行 onload or ready 需要的朋友可以过来参考下,希望对大家有所帮助
网上普遍的说法是$(document).ready()是在页面DOM解析完成后执行,而onload事件是在所有资源都准备完成之后才执行,也就是说$(document).ready()是要在onload之前执行的,尤其当页面图片较大较多的时候,这个时间差...
NULL 博文链接:https://onestopweb.iteye.com/blog/2291793
JQuery的ready函数与JS的onload的区别:1.执行时间[removed]必须等到页面内包括图片的所有元素加载完毕后才能执行。$(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕。 2.编写个数不同[removed]不能...
主要介绍了jQuery ready()和onload的加载耗时,结合实例形式对比分析了jQuery中的ready()和JavaScript的[removed]进行页面加载的时间,需要的朋友可以参考下
window.onload = function () { console.log('window.onload 方式执行') } $(document).ready(function () { console.log('$(document).ready(function(){}) 方式执行') })
新手刚学习js和jq的时候难免会接触题目所标识的相关内容,下面小编通过本教程给大家讲解(function) ready和onload 的区别,感兴趣的朋友一起看看吧
在jquery中,则使用$(document).ready()方法。下面介绍一下两者的区别。 [removed]() $(document).ready() 执行时机 在页面所有元素(包括图片,引用文件)加载完后执行。 页面中所有HTML DOM,CSS DOM结构...
$(document).Ready()方法 VS OnLoad事件 VS $(window).load()方法 接触JQuery一般最先学到的是何时启动事件。在曾经很长一段时间里,在页面载入后引发的事件都被加载在”Body”的Onload事件里. 对于Body的Onload事件...
onload是所有dom元素创建完毕,图片、css等都加在完毕后才触发 ready则是dom元素创建完毕后就被触发