前端中onload与ready的区别

 

Jquery的ready()与Javascrpit的load()

 

1 window.onload() $(document).ready()
加载时机 必须等待网页所有加载完毕(包括图片等),而后再执行JS代码 只须要等待网页中的DOM结构加载完毕,就能执行JS代码
执行次数 只能执行一次,若是第二次,那么第一次的执行会被覆盖 能够执行屡次,第N次都不会被上一次覆盖
举例

如下代码没法正确执行:html

window.onload = function() { alert(“text1”);};

 

window.onload = function() { alert(“text2”);};

结果只输出第二个dom

结果只输出第二个spa

$(document).ready(function(){alert(“Hello”)});

 

$(document).ready(function(){alert(“Hello”)});

结果两次都输出code

简写方案 $(function () {})

 

通常状况下window的load()都是用来设置body标签的onload事件.但onload事件是要在页面的元素所有加载完了才触发的,这也包括页面上的图片,以及大的表格数据。若是页面上图片较多或图片太大,加载须要较多时间,就会致使页面无响应,或者用户作了其它操做了。htm

而Jeuery中的ready()则是在页面的dom(节点)加载完后就能够作相应的操做,而不用等待所有元素加载完成.好比只知道页面某处有一张图片,而不必定要等它显示出来就能够为它绑定点击方法。blog

 

https://www.cnblogs.com/wsun/p/3916487.html事件

相关文章
相关标签/搜索