jQuery包装集操作详解：实例与功能

在jQuery的第二课中，我们深入探讨了如何操作页面上通过$函数获取的包装集元素。包装集是jQuery的核心概念之一，它使得我们可以对多个元素进行统一的操作，即使这些元素并不是通过同一个选择器选择出来的。在本节中，我们将重点讲解以下几个关键知识点： 1. **创建包装集**: $函数不仅用于选择页面上的元素，当传入一个HTML片段时，它会返回一个包含这个HTML元素的包装集。例如，代码中的`$("<p>Iamaredline.</p>").css("color","Red")`创建了一个新的`<p>`元素，并为其设置了红色文本。这个新的元素作为一个包装集被返回，可以进一步与其他元素交互。 2. **包装集操作函数**: - **html()** 和 **html(text)**: `html()` 函数返回包装集中第一个元素的HTML内容，而 `html(text)` 则会将整个包装集内所有元素的HTML内容替换为指定的`text`。 - **size()**: 返回包装集中元素的数量。 - **get()** 和 **get(n)**: `get()` 返回整个包装集作为JavaScript数组，`get(n)` 则返回第n个具体元素。 - **index(elem)**: 查找指定元素`elem`在包装集中的索引，若不存在则返回-1。 - **add()**: 添加元素到包装集，支持选择器、HTML片段、HTML元素或元素数组。 - **not(expression)** 和 **filter(expression)**: 这两个函数用于筛选包装集中的元素，`not(expression)`排除匹配`expression`的选择符，而`filter(expression)`则是保留匹配的元素。 3. **包装集应用示例**: 在实际操作中，你可以灵活地结合这些方法，如将新创建的元素添加到已有元素中(`appendTo()`), 或者筛选和操作特定条件下的元素。例如，通过`not()`函数可以排除某些不符合条件的元素，使后续操作只针对剩余的元素集。 总结来说，jQuery的包装集机制使得开发者能够方便地管理和操作DOM元素，提高了代码的简洁性和可维护性。通过理解并熟练运用这些函数，可以更高效地编写JavaScript代码来控制网页内容和行为。