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. Java排序算法（1）

    Java中的排序算法(1)  package com.softeem.jbs.lesson4; import java.util.Random; /** * 排序测试类 * * 排序算法的分类如下: ...

  2. JVM学习笔记（一）------基本结构【转】

    转自:http://blog.csdn.net/cutesource/article/details/5904501 版权声明:本文为博主原创文章,未经博主允许不得转载. 从Java平台的逻辑结构上来 ...

  3. java网络编程之TCP通讯

    java中的网络编程之TCP协议的详细介绍,以及如何使用,同时我在下面举2例说明如何搭配IO流进行操作, /* *TCP *建立连接,形成传输数据的通道: *在连接中进行大数据量传输: *通过三次握手 ...

  4. WebService工作原理

    1.WebService工作原理-SOAP 当客户端调用一个WebService的方法时,首先将方法名称和需要传递的参数包装成XML,也就是SOAP包,通过HTTP协议传递到服务器端,然后服务器端解析 ...

  5. Oracle错误：ORA-01033

    Oracle错误:ORA-01033 错误编码:ORA-01033: ORACLE initialization or shutdown in progress 故障描述:因为移动了数据库文件([NA ...

  6. 启动hadoop报192.168.1.151: Address 192.168.1.151 maps to node1, but this does not map back to the address - POSSIBLE BREAK-IN ATTEMPT!

    使用root用户启动hadoop的时候报错: [root@node1 ~]# su - hadoop -c start-all.sh starting namenode, logging to /ap ...

  7. MySQL存储引擎之InnoDB

    一.The InnoDB Engine Each InnoDB table is represented on disk by an .frm format file in the database ...

  8. 搭建HTTP Live Streaming直播系统

    最近,需要将苹果的HTTP Live Streaming系统搭建起来.完全没有头绪,故第一步就是学习. 一.学习资料 官网资料 1. http://developer.apple.com/resour ...

  9. 【转】MYSQL入门学习之二：使用正则表达式搜索

    转载地址:http://www.2cto.com/database/201212/173869.html 一.正则表达式介绍   www.2cto.com   正则表达式是用来匹配文本的特殊的串(字符 ...

  10. JAVA基础知识之网络编程——-基于UDP协议的通信例子

    UDP是一种不可靠的协议,它在通信两端各建立一个socket,这两个socket不会建立持久的通信连接,只会单方面向对方发送数据,不检查发送结果. java中基于UDP协议的通信使用DatagramS ...