博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
事件DOMContentLoaded和load的区别
阅读量:5166 次
发布时间:2019-06-13

本文共 698 字,大约阅读时间需要 2 分钟。

1.当 onload 事件触发时,页面上所有的DOM,样式表,脚本,图片,flash都已经加载完成了。

2.当 DOMContentLoaded 事件触发时,仅当DOM加载完成,不包括样式表,图片,flash。

我们需要给一些元素的事件绑定处理函数。但问题是,如果那个元素还没有加载到页面上,但是绑定事件已经执行完了,是没有效果的。

这两个事件大致就是用来避免这样一种情况,将绑定的函数放在这两个事件的回调中,保证能在页面的某些元素加载完毕之后再绑定事件的函数。

DOM文档加载的步骤为

  1. 解析HTML结构。
  2. 加载外部脚本和样式表文件。
  3. 解析并执行脚本代码。
  4. DOM树构建完成。//DOMContentLoaded
  5. 加载图片等外部文件。
  6. 页面加载完毕。//load

在第4步,会触发DOMContentLoaded事件。在第6步,触发load事件。

在没有出现DOMContentLoaded事件出现以前,许多类库中都有模拟这个事件的方法,比如jQuery中著名的 $(document).ready(function(){}); 。

1 // 不兼容老的浏览器2 document.addEventListener("DOMContentLoaded", function() {3    // ...代码...4 }, false);5 6 window.addEventListener("load", function() {7     // ...代码...8 }, false);
 
 

转载于:https://www.cnblogs.com/xuzhudong/p/7069401.html

你可能感兴趣的文章
读《构建之法-软件工程》第四章有感
查看>>
使用 Printf via SWO/SWV 输出调试信息
查看>>
.net 分布式架构之分布式锁实现(转)
查看>>
吴恩达机器学习笔记 —— 3 线性回归回顾
查看>>
Problem E: Automatic Editing
查看>>
SpringBoot 使用 MyBatis 分页插件 PageHelper 进行分页查询
查看>>
《DSP using MATLAB》Problem 6.17
查看>>
微信公众平台开发实战Java版之如何网页授权获取用户基本信息
查看>>
一周TDD小结
查看>>
sizeof与strlen的用法
查看>>
Linux 下常见目录及其功能
查看>>
开源框架中常用的php函数
查看>>
nginx 的提升多个小文件访问的性能模块
查看>>
set&map
查看>>
集合类总结
查看>>
4.AE中的缩放,书签
查看>>
CVE-2014-6321 && MS14-066 Microsoft Schannel Remote Code Execution Vulnerability Analysis
查看>>
给一次重新选择的机会_您还会选择程序员吗?
查看>>
Mysql MHA高可用集群架构
查看>>
心急的C小加
查看>>