开机检查：认识 $ 与 jQuery 对象
文档摘要
第 1 章 · 开机检查：认识 $ 与 jQuery 对象 章节摘要：任何手术开始前都有开机检查——确认设备能用、器械消毒到位、患者信息核对无误。本章就是 jQuery 手术台的开机检查：搞清楚 这个符号到底调用了什么、 返回的 jQuery 对象和原生 DOM 节点有什么本质区别、 机制为什么是所有操作的起跳板，以及面对众多版本该如何为项目选型。读完本章，你能解释"为什么 $('#x') 拿到的元素不能直接用 onclick 属性"，并能根据项目环境选对引入的版本与方式。 学习目标 读完本章，你应当能够： 说出 与 全局函数的关系，并用代码验证两者全等。 解释 jQuery 对象与原生 DOM 节点的包装关系，演示两者互相转换的写法。 用 与原生 各写一遍"文档就绪后执行"，并说清差异。
第 1 章 · 开机检查：认识 $ 与 jQuery 对象
章节摘要：任何手术开始前都有开机检查——确认设备能用、器械消毒到位、患者信息核对无误。本章就是 jQuery 手术台的开机检查：搞清楚
$这个符号到底调用了什么、$(...)返回的 jQuery 对象和原生 DOM 节点有什么本质区别、ready机制为什么是所有操作的起跳板，以及面对众多版本该如何为项目选型。读完本章，你能解释"为什么 $('#x') 拿到的元素不能直接用 onclick 属性"，并能根据项目环境选对引入的版本与方式。
学习目标
读完本章，你应当能够：
- 说出
$与jQuery全局函数的关系，并用代码验证两者全等。 - 解释 jQuery 对象与原生 DOM 节点的包装关系，演示两者互相转换的写法。
- 用
$(document).ready()与原生DOMContentLoaded各写一遍"文档就绪后执行"，并说清差异。 - 区分
window.onload与ready的触发时机，判断在什么场景该用哪个。 - 根据项目是否兼容旧浏览器，选择合适的 jQuery 版本与压缩形式。
- 使用
noConflict处理多库共存的符号冲突。
核心概念速览
本章的核心只有一句：$ 是工厂函数，jQuery 对象是原生节点的"手术衣"。你传入选择器或 DOM 节点，它把匹配结果包成一件带工具的衣服——之后所有的操作方法都缝在这件衣服上，而不是缝在裸节点上。
子章节导航
- 1.1 认识手术台：jQuery 包装对象与 ready：拆开
$看内部——工厂函数的入参形态、jQuery 对象的伪数组结构、与原生节点的互转、ready的触发时机。本章的地基，后面六章全都站在这节之上。 - 1.2 器械迭代史：版本演进与选型：从 1.x 到 3.x 的演进脉络——每一代解决了什么、放弃了什么；压缩版与未压缩版怎么选、老项目为什么动不得版本、
noConflict怎么让 jQuery 与其他库同台。
子章节之间的逻辑关系
1.1 认识手术台 1.2 器械迭代史 ────────────── ────────────── $ 是什么（运行机制） 版本怎么选（工程决策） │ │ └──────────┬──────────────────┘ ▼ 进入第 2 章：选择器 （知道 $ 怎么包装，才谈得上选得准）
1.1 回答"这台机器的原理"，1.2 回答"这台机器该买哪个型号"——前者是理解，后者是决策，两者都不依赖对方，但都依赖你对"手术台要做什么"有整体认知。
术前核对单：本章可考核的知识点
开机检查的验收标准不是"读完了"，而是下面这张单子逐项能打勾。每项都配了一个可执行的判定动作，读者可以拿标本页当场验证：
| 核对项 | 判定动作 | 达标标准 |
|---|---|---|
$ 与 jQuery 的关系 | 控制台执行 $.fn === jQuery.fn |
返回 true，说明两者指向同一对象 | |
| 工厂函数的入参形态 | 分别传入选择器、节点、HTML 字符串、函数 | 能说出每种入参各自的返回结果 |
| jQuery 对象的伪数组本质 | 查看 $('.item').length 与 $('.item')[0] |
下标取出的是原生节点，不是 jQuery 对象 |
| 包装与拆包互转 | $(el) 与 $(jq).get(0) 两个方向各写一遍 |
双向转换无误，知道何时需要拆包 |
ready 的触发时机 |
在 ready 回调里打印时间戳，与 DOMContentLoaded 对比 |
两者同档触发，早于 window.onload |
$(fn) 简写 | 用函数直接作入参 | 效果等价于 $(document).ready(fn) |
||
| 版本线的选择依据 | 面对"要兼容老浏览器吗"这个提问 | 能答出 1.x 兼容旧 IE、3.x 只保现代浏览器 |
| slim 版的取舍 | 说明 slim 砍掉了什么 | 答出 AJAX 与效果模块，判断项目是否需要 |
noConflict 的用法 |
恢复 $ 归属后再继续用 jQuery |
能写出 var jq = jQuery.noConflict() 之后的代码 |
这张单子里最容易漏判的是第三项：很多初学者以为 $('.item')[0] 还是个 jQuery 对象，接着对它调 addClass，页面毫无反应也不报错。这正是开机检查要拦下的误诊——拆了包的东西，得重新穿上手术衣才能动刀。
新手最常踩的三个坑（本章版）
其一，脚本放在头部、又在 ready 外直接操作 DOM，元素还没解析出来，选择器空手而归；其二，把 jQuery 对象当原生节点用（或反过来），方法不存在或属性是 undefined；其三，在 window.onload 里做全部初始化，图片多时用户等半天才见交互。三个坑的病根都指向"时机与包装"——1.1 节会逐一给出复现与修法。
前置知识与后续延伸
前置知识只需要两项：HTML 文档结构的基本概念（标签、属性、嵌套关系），以及 JavaScript 的函数调用与对象字面量写法。不需要任何前端框架经验。
往后走，第 2 章会立刻用到本章的包装概念——$('.item') 的返回值就是你将在 1.1 节拆开看的那种伪数组。如果只打算读一章再决定要不要继续，读本章：它决定了你能否用正确的姿势理解后续所有 API。