jQuery中end()方法用法实例

简介

end() 方法是jQuery 中一种非常有用的遍历方法。该方法返回之前选择器操作前的状态（例如，选择器指向之前选择器的上一级或同级）。

语法

$(selector)
.methods()
.end()

• selector：必选，用来筛选元素的选择器。
• methods()：必选，jQuery 所提供的方法名称。
• end()：可选，返回被操作元素之前所有状态。

示例说明

示例1：直接跳出选择器链

<div id="out">
  <p class="inner">The first paragraph.</p>
  <p class="inner">The second paragraph.</p>
</div>

我们来对这个简单的 HTML 结构使用 jQuery 来选择所有的文本框，然后回到它们的父级。代码如下：

$("input:text") //选择所有的文本框
.parents()
.end()

该代码将返回所有匹配元素文本框并且回到它们的父级，等同于 $("input:text").parent()。

示例2：返回初始选择器

在使用多个方法链操作时，可以使用 end() 方法返回之前的初始状态。代码如下：

$("input:text")
.addClass('border')  // 高亮文本框
.end()
.eq(0)
.val('默认文本')

end() 方法会返回到选择所有文本框的初始状态，并选择第一个文本框来设定默认值。

总结

使用end() 方法可以在 jQuery 操作过程中，轻松返回之前的状态，提高编码效率，并简洁代码结构。