onload，DOMContentLoaded和jQuery的.readyd的区别：1、触发时机不同；2、应用场景不同等。触发时机不同是指onload事件是在所有资源加载完成后触发，DOMContentLoaded事件是在DOM树构建完成后立即触发。
一、onload，DOMContentLoaded和jQuery的.ready的区别
1、触发时机不同
onload事件是在所有资源加载完成后触发，包括图片、脚本和样式表等；DOMContentLoaded事件是在DOM树构建完成后立即触发，不需要等待其他资源的加载；jQuery的ready事件是在DOM树构建完成后，CSS和图片等资源也加载完成后触发。
2、应用场景不同
onload事件适合处理与页面内容相关的操作；DOMContentLoaded事件适合处理DOM元素操作，如添加事件监听器等；jQuery的ready事件既能够处理与页面内容相关的操作，也能够处理外部资源加载完成后的回调。
3、获取资源状态的能力不同
onload事件可以获得所有资源的加载状态；DOMContentLoaded事件只能获取DOM树的构建状态，无法获取外部资源（如图片、音频、视频等）的加载状态；jQuery的ready事件可以确保页面中所有资源都已经加载完成，包括外部资源。
二、jQuery 概述
1、JavaScript 库
库，是用于开发软件的子程序集合。库和可执行文件的区别是，库不是独立程序，他们是向其他程序提供服务的代码库链接。JavaScript 库即 library，是一个封装好的特定的集合（方法和函数）。就是把各种常用的代码片段，组织起来放在一个 js 文件里，组成一个包，这个包就是 JavaScript 库。
简单理解就是一个 JS文件，里面对我们原生 js 代码进行了封装，存放到里面。这样我们就可以快速高效的使用这些封装好的功能了。比如 jQuery，就是为了快速方便的操作 DOM，里面基本都是函数（方法）。再比如 Prototype、Dojo、Extjs 、 YUI、移动端的 zepto 等等，这些都是优异的 JavaScript 库。它们都是对原生 JavaScript 的封装，内部都是用 JavaScript 实现的。
2、jQuery
jQuery 是一个快速、简洁的 JavaScript 框架，是继 Prototype 之后又一个优异的 JavaScript 代码库（ 或 JavaScript 框架 ）。 jQuery 设计的宗旨是 “write Less，Do More”，即倡导写更少的代码，做更多的事情。jQuery = javascript Query（查询）。意思是查询 js，把 js 中的 DOM 操作做了封装，我们可以快速的查询使用里面的功能。它封装 JavaScript 常用的功能代码，提供一种简便的 JavaScript 设计模式，优化 HTML 文档操作、事件处理、动画设计和 Ajax 交互。
3、jQuery 优点
- 轻量级，体积小，不会影响页面加载速度。
- 强大的选择器。
- 方便的选择页面元素（模仿 css 选择器更精确、更灵活）。
- 出色的 DOM 操作的封装。
- 对事件、样式、动画支持，大大简化了 DOM 操作。
- 跨浏览器兼容。基本兼容了现在主流的浏览器。
- 链式操作、隐式迭代。
- 支持插件扩展开发，有着丰富的第三方插件。
- 免费、开源。
4、jQuery 特点
- 快速获取文档元素： jQuery的选择机制构建于Css的选择器，它提供了快速查询DOM文档中元素的能力，而且大大强化了JavaScript中获取页面元素的方式。
- 提供漂亮的页面动态效果：jQuery中内置了一系列的动画效果，可以开发出非常漂亮的网页，许多网站都使用jQuery的内置的效果，比如淡入淡出、元素移除等动态特效。
- 创建AJAX无刷新网页：AJAX是异步的JavaScript和XML的简称，可以开发出非常灵敏无刷新的网页，特别是开发服务器端网页时，比如PHP网站，需要往返地与服务器通信，如果不使用AJAX，每次数据更新不得不重新刷新网页，而使用AJAX特效后，可以对页面进行局部刷新，提供动态的效果。
- 提供对JavaScript语言的增强：jQuery提供了对基本JavaScript结构的增强，比如元素迭代和数组处理等操作。
- 增强的事件处理：jQuery提供了各种页面事件，它可以避免程序员在HTML中添加太多事件处理代码，最重要的是，它的事件处理器消除了各种浏览器兼容性问题。
- 更改网页内容：jQuery可以修改网页中的内容，比如更改网页的文本、插入或者翻转网页图像，jQuery简化了原本使用JavaScript代码需要处理的方式。
5、jQuery语法
jQuery 语法是通过选取 HTML 元素，并对选取的元素执行某些操作。
基础语法：
$(selector).action()- 美元符号定义 jQuery
- 选择符（selector）“查询”和”查找” HTML 元素
- jQuery 的 action() 执行对元素的操作
示例：
- $(this).hide() ：隐藏当前元素
- $(“p”).hide() ：隐藏所有元素
- $(“p.test”).hide() ：隐藏所有 class=”test” 的元素
- $(“#test”).hide() ：隐藏所有 id=”test” 的元素
三、onload事件
在 JavaScript 中，onload 事件在页面完全加载完毕的时候触发。该事件包含所有的图形图像、外部文件（如 CSS、JS 文件等）的加载，也就是说，在页面所有内容全部加载之前，任何 DOM 操作都不会发生。为 window 对象绑定 onload 事件的方法有两种。
1、直接为 window 对象注册页面初始化事件处理函数
window.onload = f;
function f() {
alert("页面加载完毕");
}2、在页面标签中定义onload 事件处理属性
<body onload="f()">
<script>
function f() {
alert("页面加载完毕");
}
</script>延伸阅读1：onload的定义和用法
- onload 事件在对象被加载后发生。
- onload 最常用于 元素中，用于在网页完全加载所有内容（包括图像、脚本文件、CSS 文件等）后执行脚本。
- onload 事件可用于检查访问者的浏览器类型和浏览器版本，并根据这些信息加载网页的正确版本。
- onload 事件也可用于处理 cookie。
