HTMLDom ready
程序员文章站
2022-04-27 11:04:14
...
本节内容主要收集一些有关DOM文档ready有关的一些知识。
onload事件:是在网页资源(页面上所有的DOM,样式表,脚本,图片,flash等)全部
加载完毕后触发的一种事件。
DOMContentLoaded事件:是早于onload事件触发的一种事件。具体的时机是页面文档
加载完毕的时候。
dom的Ready跟我们平时那些开发有关呢?
比如常见的:
1.给一些元素绑定处理事件,但是如果代码写的不恰当,会造成文档元素还没加载
完毕,事件却已经执行完了,这样肯定是没有效果的。
2.还比如页面上的图片,flash虽然还没加载出来,但是其他的内容我们已经看到了
我们却不能做交互。常见的比如登录邮箱页面,邮箱地址和密码输入框已经
看到了,但是由于网页慢,该页面上的广告和动画还没加载出来,我们希望这时
可以进行信息的输入,我们才不管那些动画啥的好了没。
一般javaScript框架在处理不同浏览器的dom ready时涉及到以下知识点:
非IE内核中:
比如轮询document的readyState属性,
还有是否支持DOMContentLoaded事件。
IE内核中:
在IE内核中,doScroll函数必须在DOM加载完成后才能执行。
还有侦测doucument的onreadystatechange是否是complete。
当然上面的划分非IE内核啥的不太确切。现在IE内核也在进化。浏览器厂商越来越靠近
标准了。所以实际上做这方面处理时,是不侦测浏览器类型的,只看你是否支持这个函数
或类似函数。
更具体的解释可以看下网上这几篇博客:
http://qingbob.com/blog/从onload和DOMContentLoaded谈起
http://www.cnblogs.com/rubylouvre/archive/2009/12/30/1635645.html
http://www.cnblogs.com/zhangziqiu/archive/2011/06/27/domready.html
推荐阅读
-
JQ中$(window).load和$(document).ready区别与执行顺序
-
vuejs实现ready函数加载完之后执行某个函数的方法
-
JQuery中window.onload函数与$(document).ready()的区别实例讲解
-
Jquery中$(document).ready(function(){ })函数的使用详解
-
[下载]NVIDIA发布378.66的Game Ready驱动:游戏/视频双优化
-
提取jquery的ready()方法单独使用示例
-
JQuery的ready函数与JS的onload的区别详解
-
JQ中$(window).load和$(document).ready区别与执行顺序
-
jquery中的$(document).ready()使用小结
-
vuejs实现ready函数加载完之后执行某个函数的方法