### JQuery实例教程基础知识点详解
#### 一、选择器 - JQuery的核心功能
JQuery通过其强大的选择器系统，简化了HTML文档的操作，使得开发者能够快速定位并操作DOM元素。以下是对给定文件中提到的选择器的详细解释：
##### 1. 基本选择器
- **#id**：用于选取拥有特定ID的单个元素。
- **实例**：`<p id="testID">testID</p>`
- **JQuery代码**：`$("#testID").html();`
- **Element**：选取页面上所有具有指定标签名的元素。
- **实例**：`<div>div1</div><div>div2</div>`
- **JQuery代码**：`$("div");`
- **.class**：选取具有特定类的所有元素。
- **实例**：`<div class="testClass">testClass</div>`
- **JQuery代码**：`$(".testClass");`
##### 2. 层级选择器
这些选择器帮助我们基于元素的层级关系进行选择。
- **ancestor descendant**：选取所有指定祖先元素下的后代元素。
- **实例**：`<form><label>Name:</label><input name="name"/><fieldset><label>Newsletter:</label><input name="newsletter"/></fieldset></form><input name="none"/>`
- **JQuery代码**：`$("form input")`
- **结果**：`[<input name="name"/>, <input name="newsletter"/>]`
- **parent > child**：选取指定父元素的直接子元素。
- **实例**：同上
- **JQuery代码**：`$("form > input")`
- **结果**：`[<input name="name"/>]`
- **prev + next**：选取紧跟在特定元素后的下一个兄弟元素。
- **实例**：同上
- **JQuery代码**：`$("label + input")`
- **结果**：`[<input name="name"/>, <input name="newsletter"/>]`
- **prev ~ siblings**：选取特定元素之后的所有兄弟元素。
- **实例**：同上
- **JQuery代码**：`$("form ~ input")`
- **结果**：`[<input name="none"/>]`
##### 3. 基本过滤选择器
- **first() 或 :first**：选取匹配元素中的第一个。
- **实例**：`<ul><li>listitem1</li><li>listitem2</li><li>listitem3</li></ul>`
- **JQuery代码**：`$("li").first();` 或者 `$("li:first")`
- **结果**：`[<li>listitem1</li>]`
- **last() 或 :last**：选取匹配元素中的最后一个。
- **实例**：同上
- **JQuery代码**：`$("li").last();` 或者 `$("li:last")`
- **结果**：`[<li>listitem3</li>]`
- **:not, not()**：排除匹配特定选择器的元素。
- **实例**：`<input name="apple"/><input name="flower" checked="checked"/>`
- **JQuery代码**：`$("input:not(:checked)")` 或者 `alert($("input").not($("input:checked")).val())`
- **:even**：选取索引为偶数的元素（从0开始）。
- **实例**：`<table><tr><td>Header1</td></tr><tr><td>Value1</td></tr><tr><td>Value2</td></tr></table>`
- **JQuery代码**：`alert($("tr:even").eq(1).text())`
- **结果**：`Value2`
- **:odd**：选取索引为奇数的元素（从0开始），虽然在给定文件中没有提及，但它是与`:even`相对应的选择器，用于选取奇数位置的元素。
这些选择器是JQuery中最基础且常用的部分，掌握它们将极大地提升你在网页开发中的效率。通过组合使用这些选择器，你可以非常灵活地定位到页面中的任何元素，无论是基于元素的类型、ID、类，还是基于元素在文档树中的位置，甚至是元素的状态或特性。在实际项目中，合理运用这些选择器将使你的代码更加简洁、高效，同时也能提高代码的可读性和维护性。
