0.加载完页面,解析完所有标签(不包括执行CSS和JS),并如规范中所说的设置 interactive 和执行每个静态的script标签中的JS,然后触发。

1.没有js,有css,有img,DOMContentLoaded事件不直接等待CSS文件、图片的加载完成

2.有js,没有css,有img,DOMContentLoaded事件需要等待JS执行完才触发

3.有js,而且js前面有css,没有img,DOMContentLoaded事件需要等待css加载完,JS执行完才触发

总结:DOMContentLoaded依赖js执行完,js执行依赖css加载完。

tips:img展现,依赖css加载完,不依赖js执行完。

参考:http://www.alloyteam.com/2014/03/effect-js-css-and-img-event-of-domcontentloaded/

关于dom ready事件的更多相关文章

  1. Web UI - Javascript之DOM Ready

    最近终于稍微适应了工作环境,终于可以让自己缓口气.于是决定要写点东西,算是督促.记录和提升自己的学习.代码的世界,你不轮它,以后就会被它轮.这个系列尽量保持在一周或两周更一篇,目标是在创造内容的时候更 ...

  2. DOM Ready 详解

    DOM Ready 概述 熟悉jQuery的人, 都知道DomReady事件. window.onload事件是在页面所有的资源都加载完毕后触发的. 如果页面上有大图片等资源响应缓慢, 会导致wind ...

  3. 【jQuery源码】DOM Ready

    一直以来,各种JS最佳实践都会告诉我们,将JS放在HTML的最后,即</body>之前,理由就是:JS会阻塞下载,而且,在JS中很有可能有对DOM的操作,放在HTML的最后,可以尽可能的保 ...

  4. [转]jQuery DOM Ready

    一直以来,各种JS最佳实践都会告诉我们,将JS放在HTML的最后,即</body>之前,理由就是:JS会阻塞下载,而且,在JS中很有可能有对DOM的操作,放在HTML的最后,可以尽可能的保 ...

  5. ready 事件 DOM(文档对象模型) 已经加载....

    定义和用法 当 DOM(文档对象模型) 已经加载,并且页面(包括图像)已经完全呈现时,会发生 ready 事件. 由于该事件在文档就绪后发生,因此把所有其他的 jQuery 事件和函数置于该事件中是非 ...

  6. jquery的ready事件的实现机制浅析

    页面初始化中,用的较多的就是$(document).ready(function(){//代码}); 或 $(window).load(function(){//代码}); 他们的区别就是,ready ...

  7. jQuery源码dom ready分析

    一.前言 在平时开发web项目时,我们使用jquery框架时,可能经常这样来使用$(document).ready(fn),$(function(){}),这样使用的原因是在浏览器把DOM树渲染好之前 ...

  8. jquery dom ready, jqery2.1.1实现-源码分析

    本文链接http://www.cnblogs.com/Bond/p/4178311.html jquery document  ready的实现其很很简,虽说简单,其很很多人还是没去关注过它的实现.我 ...

  9. 5事件DOM零级事件跟DOM二级事件

    事件的行为传播,行为本身跟事件绑定没有关系:1.全新认识事件(某一个具体的行为)->行为本身:浏览器天生自带的一些行为操作->click,mouseover(mouseenter),mou ...

随机推荐

  1. mysql 利用binlog增量备份,还原实例

    mysql 利用binlog增量备份,还原实例 张映 发表于 2010-09-29 分类目录: mysql 标签:binlog, mysql, mysqldump, 增量备份 一,什么是增量备份 增量 ...

  2. sqlite3内存不断增加的原因

    数据库是这样设计的:用内存保存数据,以提高增删查改的速度,同时把数据写入磁盘,让数据落地. 如果不删除数据库里的数据,随着数据不断地添加到数据库,数据库越来越大,RES内存也越来越大. 见测试代码a. ...

  3. ado.net基础思想-abstract

    抽象类用做基类不能被实例化用途是派生出其他非抽象类 接口主要是实现多重继承 abstract 修饰符用于表示所修饰的类是不完整的,并且它只能用作基类.抽象类与非抽象类在以下方面是不同的:• 抽象类不能 ...

  4. java文件上传到服务器

    最近项目中使用到了文件从本地到服务器的功能.其实是为了解决目前浏览器不支持获取本地文件全路径.不得已而想到上传到服务器的固定目录,从而方便项目获取文件,进而使程序支持EXCEL批量导入数据. 在前台界 ...

  5. javaWEB国际化(jsp中使用)

    在jsp页面中使用国际化方法,首先将jstl开源架包:jstl.jar,standard.jar导进去 并在src目录下建立以test开头,.properties结尾的文件:test_en_US.pr ...

  6. 欧拉通路-Play on Words 分类: POJ 图论 2015-08-06 19:13 4人阅读 评论(0) 收藏

    Play on Words Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 10620 Accepted: 3602 Descri ...

  7. vc6

    适合win7使用的: http://pan.baidu.com/s/1nt7SG57

  8. JAVA中线程池启动定时任务

    /** * 用线程池启动定时器 * @param args */ public static void main(String[] args) { //10秒启动 Executors.newSched ...

  9. shell中cut用法

    cut是一个选取命令,就是将一段数据经过分析,取出我们想要的.一般来说,选取信息通常是针对“行”来进行分析的,并不是整篇信息分析的. (1)其语法格式为:cut  [-bn] [file] 或 cut ...

  10. sh和bash的区别

    在鸟哥的私房菜的一书中,介绍了UNIX的版本以及众多的SHELL版本. 早在UNIX年代,发展者众多,所以由于shell依据发展者的不同就有许多版本,比如sh,C SHell,K SHell,还有TC ...