document load 和 document ready 的区别

简介: document load 和 document ready 的区别


       文档解析过程中,ready在加载图片等外部资源前触发,load在之后触发。如果页面中要是没有图片之类的媒体文件的话ready与load是差不多的,但是页面中有文件就不一样了,所以还是推荐大家在工作中用ready

DOM文档解析:

  1. 解析html结构
  2. 加载脚本和样式文件
  3. 解析并执行脚本
  4. 构造html的DOM模型 // ready
  5. 加载图片等外部资源文件
  6. 页面加载完毕 // load


页面加载完成有两种事件

1.load是当页面所有资源全部加载完成后(包括DOM文档树,css文件,js文件,图片资源等),执行一个函数

缺点:如果图片资源较多,加载时间较长,onload后等待执行的函数需要等待较长时间,所以一些效果可能受到影响

代码形式:


//document load
$(document).load(function(){
    ...code...
})

 

2.$(document).ready()是当DOM文档树加载完成后执行一个函数 (不包含图片,css等)所以会比load较快执行

在原生的jS中不包括ready()这个方法,Jquery才有,jquery中有 $().ready(function)。

代码形式为:


//document ready
$(document).ready(function(){
    ...code...
})
//document ready 简写
$(function(){
    ...code...
})


相关文章
|
5月前
|
前端开发 JavaScript API
前端组件库Layui知识点大全(一)
教程来源 https://hllft.cn/category/artificial-intelligence.html Layui是由国内开发者“贤心”于2016年推出的开源前端UI框架,秉持“返璞归真”理念,不依赖Webpack等工程化工具,基于原生HTML/CSS/JS与轻量模块化规范,专为后端开发者、初学者及追求高效开发的群体设计,低门槛、拿来即用。
|
10月前
|
Cloud Native IDE Go
升级 GoLand 2025.1 = 云原生开发提速 80%!微服务 + 容器化一键适配+安装包
GoLand 2025.1 是 JetBrains 推出的 Go 语言旗舰 IDE,全面支持 Go 1.23 新特性,强化泛型、模块化与并发开发体验。内置 AI 辅助、多版本切换、云原生工具链,深度优化性能,提升编码、调试、测试全流程效率,助力开发者高效构建现代 Go 应用。
458 2
|
前端开发 JavaScript
前端 js 经典:数组常用方法总结
前端 js 经典:数组常用方法总结
342 0
|
缓存 算法 C语言
【C++ 标准查找算法 】C++标准库查找算法深入解析(In-depth Analysis of C++ Standard Library Search Algorithms)
【C++ 标准查找算法 】C++标准库查找算法深入解析(In-depth Analysis of C++ Standard Library Search Algorithms)
491 0
|
JavaScript 前端开发 开发者
|
供应链 Python
Demand Forecasting模型解释与Python代码示例
Demand Forecasting模型解释与Python代码示例
|
存储 NoSQL 关系型数据库
(二)漫谈分布式之理论篇:用刁钻的手法掰正你那学歪的CAP与BASE理论!
大多数讲分布式的资料、课程,虽然在一开始就会先讲述CAP理论,但大家仔细想想,你在做分布式项目时,落地过这个基础理论吗?相信包括我在内,以及90%以上的开发者,没有,至于为何,本文来从不一样的角度好好唠唠CAP,以及另一个著名的BASE理论~
684 0
|
机器学习/深度学习 人工智能 数据可视化
东哥教你如何用Orange Ai pro为家里做一个垃圾分类检测机器
## 摘要 本文由东哥原创,介绍了使用Orange AI Pro开发板进行AI项目开发的体验。这款开发板主打强大的AI算力,搭载昇腾AI芯片,提供8-12TOPS的性能,媲美英伟达RTX3080显卡。它支持外接eMMC和4K显示器,适合实时视频流模型部署。作者详细阐述了从购买、烧录镜像到环境配置的过程,包括安装ACLLite库、模型转换工具ATC的使用,以及YOLOv5模型的转换和部署。文章还展示了如何建立一个垃圾检测项目,利用计算机视觉进行实时垃圾分类,并分享了性能体验,认为开发板在散热和噪音控制上表现良好,适合AI爱好者和开发者进行DIY项目。
基于PID-bang-bang控制算法的卫星姿态控制matlab仿真
该文主要介绍了一个基于PID-bang-bang控制算法的卫星姿态控制系统。在MATLAB2022a中进行了仿真,生成了控制收敛曲线和姿态调整动画。系统通过PID控制器减少误差,结合Bang-Bang控制实现快速响应。核心程序涉及卫星位置、推力向量的计算及动画绘制。PID控制器利用比例、积分、微分项调整输出,Bang-Bang控制则在误差超出阈值时提供即时修正。两者结合以平衡控制精度和响应速度,适应卫星姿态的精确调节需求。
事后回顾------AAR复盘方法
事后回顾------AAR复盘方法
2616 0