onload触发时机:文档和所有的图片都加载完毕

DOMContentLoaded触发时机:文档加载并解析完毕,所有deferred脚本执行完毕。但此时图片和async脚本可能依旧在加载。

readystatechange触发时机:

  document.readyState属性包含多个状态,当值为“complete”时表明文档加载并执行完毕。

将事件绑定到DOMReady上的方法封装:

 var whenReady = ( function(){
var funcs = [];
var ready = false; function handler( e ){
if( ready ) return;
if( e.type === "readystatechange" && document.readyState !== "complete" ) return;
for( var i=0; i < funcs.length; i++ ){
funcs[i].call( document );
}
ready = true;
funcs = null;
} if( document.addEventListener ){
document.addEventListener( "DOMContentLoaded", handler, false );
document.addEventListener( "readystatechange", handler, false );
window.addEventListener( "load", handler, false );
}else if( document.attachEvent ){
document.attachEvent( "onreadystatechange", handler );
window.attachEvent( "load", handler );
} return function whenReady( f ){
if( ready ) f.call( document );
else funcs.push( f );
}
}() );

原生js--文档加载时间的更多相关文章

  1. js 文档加载完成之后执行 备用

    //文档加载完成之后执行 (function(){ var _globeCallback; window.$$ = function(callback){ _globeCallback = callb ...

  2. 原生JS与jQuery文档加载完毕的写法

    HTML是有执行顺序的,默认是自上而下执行.所以当我们的js代码在html代码下边的时候,可以正常执行,而当我们的js代码在html代码上边的时候,可以就无法正常执行了,这时,我们需要在文档加载完毕的 ...

  3. 使用js主函数的原因是等文档加载完了才给里面的元素添加东西 如果不使用主函数则文档加载时候无法找到元素则不能成功给元素添加事件

    使用js主函数的原因是等文档加载完了才给里面的元素添加东西 如果不使用主函数则文档加载时候无法找到元素则不能成功给元素添加事件

  4. js坚持不懈之14:不要在文档加载之后使用 document.write()示例

    在看w3school的JavaScript教程时,关于文档输出流中有这么一句话:绝不要在文档加载之后使用 document.write().这会覆盖该文档. 不太明白什么意思,找了一个例子: < ...

  5. JQuery文档加载完成执行js的几种方法

    js中文档加载完毕.一般在body加一个onload事件或者window.onload = function () {} jQuery中有好多写法,平时也不注意,别人一问,还真觉得头大. 下面是我整理 ...

  6. 基于DOMContentLoaded实现文档加载完成后执行的方法

    我们有时可能需要一些在页面加载完成之后执行的方法,其实js原生就提供了onload方法,所以我们最简单的办法就是直接给onload赋值一个函数,在页面加载完成之后就会自动执行 widnow.onloa ...

  7. jQuery文档加载完毕的几种写法

    js中文档加载完毕.一般在body加一个onload事件或者window.onload = function () {} jQuery中有好多写法,平时也不注意,别人一问,还真觉得头大. 下面是我整理 ...

  8. jquery文档加载几种写法,图片加载写法

    jquery文档加载写法: $(function(){ }) ; //个人最常使用方式 $(document).ready(function(){ }); //调用文档对象下的ready方法传入一个函 ...

  9. jQuery---jQ动画(普通,滑动,淡入淡出,自定义动画,停止动画),jQuery的事件,jQ事件的绑定/解绑,一次性事件,事件委托,事件冒泡,文档加载

    jQuery---jQ动画(普通,滑动,淡入淡出,自定义动画,停止动画),jQuery的事件,jQ事件的绑定/解绑,一次性事件,事件委托,事件冒泡,文档加载 一丶jQuery动画 show,hide, ...

随机推荐

  1. Linux 限制用户远程SSH登录

    通过/etc/hosts.allow和/etc/hosts.deny两个配置文件远程限制某个IP和某段IP地址允许或拒绝访问Linux服务器 SSH.FTP.telnet等服务,其中/etc/host ...

  2. Linux服务器 java生成的图片验证码乱码问题

    问题:如图所示项目中生成的图形验证码不能正常显示出需要的字体 原因:  linux下没有对应的字体 查找项目中使用到系统字体的地方,如下: 解决: 1. 在本地 路径 C:\Windows\Fonts ...

  3. 配置Tomcat监听80端口 配置Tomcat虚拟主机 Tomcat日志

    配置Tomcat监听80端口 • vim /usr/local/tomcat/conf/server.xml Connector port=" protocol="HTTP/1.1 ...

  4. 限制 Text Field 输入的内容类型:只允许输入数字

    效果如下: ViewController.h #import <UIKit/UIKit.h> @interface ViewController : UIViewController< ...

  5. [转]python的requests发送/上传多个文件

    1.需要的环境 Python2.X Requests 库 2.单字段发送单个文件 在requests中发送文件的接口只有一种,那就是使用requests.post的files参数, 请求形式如下:   ...

  6. Android学习之——实现圆角Button

    在drawable文件夹下新建btn_shape.xml文件: <?xml version="1.0" encoding="utf-8"?> < ...

  7. Spring MVC异常处理详解 ExceptionHandler good

    @ControllerAdvice(basePackageClasses = AcmeController.class) public class AcmeControllerAdvice exten ...

  8. php解析mpp文件中的多级任务

    获取层级的project任务  参考 启动javabridge java -jar JavaBridge.jar SERVLET_LOCAL:8089 1.读取mpp文件 $file_path = & ...

  9. go语言中文网中的资源

    https://studygolang.com/subject/2     Go 系列教程 https://studygolang.com/subject/74   Go 语言机制 https://s ...

  10. [转]IOS 崩溃日志分析

    以下是一个crash log示例: // 1: Process Information Incident Identifier: 30E46451-53FD--896A-457FC11AD05F Cr ...