window.load和doucment.ready有啥区别
2016-07-14 14:03
399 查看
window.load和doucment.ready有啥区别
JavaScript 中的以下代码 : Window.onload = function (){// 代码 } 等价于 Jquery 代码如下: $(window).load(function (){// 代码 }); 执行时机 window.load——必须等待网页中所有的内容加载完毕后 ( 包括图片 ) 才能执行 $(document).ready()——网页中所有 DOM 结构绘制完毕后就执行,可以能 DOM 元素关联的内容并没有加载完 编写个数 window.load——不能同时编写多个以下代码无法正确执行: window.onload = function(){ alert(“text1”);};window.onload = function(){ alert(“text2”);};结果只输出第二个 $(document).ready()——能同时编写多个以下代码正确执行: $(document).ready(function(){ alert(“Hello World”);});$(document).ready(function(){ alert(“Hello again”);}); 结果两次都输出 以 浏览器装载文档为例,在页面加载完毕后,浏览器会通过 Javascript 为 DOM 元素添加事件。在常规的 Javascript 代码中,通常使用 window.onload 方法,而在 Jquery 中,使用的是$(document).ready() 方法。 $(document).ready() 方法是事件模块中最重要一个函数,可以极大的提高Web 应用程序的速度。 另外,需要注意一点,由于在 $(document).ready() 方法内注册的事件,只要 DOM 就绪就会被执行,因此可能此时元素的关联文件未下载完。 例如与图片有关的 html 下载完毕,并且已经解析为 DOM 树了,但很有可能图片还没有加载完毕,所以例如图片的高度和宽度这样的属性此时不一定有效。要解决这个问题,可以使用 Jquery 中另一个关于页面加载的方法 ---load() 方法。 Load() 方法会在元素的onload 事件中绑定一个处理函数。 如果处理函数绑定给 window 对象,则会在所有内容 ( 包括窗口、框架、对象和图像等 ) 加载完毕后触发,如果处理函数绑定在元素上,则会在元素的内容加载完毕后触发。 总结: js:window.onload页面一运行就执行该函数,执行该函数时,可能页面中的图片还没有加载完成! jquery: $(window).load()页面中的图片或其它东西加载完成之后,执行该函数。
相关文章推荐
- 一个关于if else容易迷惑的问题
- JQuery1——基础($对象,选择器,对象转换)
- Android学习笔记(二九):嵌入浏览器
- Android java 与 javascript互访(相互调用)的方法例子
- PHP5.2.*防止Hash冲突拒绝服务攻击的Patch
- 深入理解PHP之匿名函数
- JavaScript演示排序算法
- 2015-2016网页设计趋势分析 Web Design of Trends
- JSP/PHP基于Ajax的分页功能实现
- javascript实现10进制转为N进制数
- 关于PHP通过PDO用中文条件查询MySQL的问题。
- jQuery Ajax 跨域调用
- 什么是设计模式
- 移动端的长按事件
- jquery教程靠边站,一分钱不花让你免费学会jquery
- JQuery+Strusts1.x无刷新登录
- PHP数据库长连接mysql_pconnect的细节