Question

我访问网站http://api.jquery.com/end/只是为了了解end（）的使用方式及其工作原理。不幸的是，我只是不明白它做了什么。所以我需要知道在什么样的情况下应该使用end（）。

这是一个小例子

<ul class="first">
  <li class="foo">list item 1</li>
  <li>list item 2</li>
  <li class="bar">list item 3</li>
</ul>
<ul class="second">
  <li class="foo">list item 1</li>
  <li>list item 2</li>
  <li class="bar">list item 3</li>
</ul>

 $('ul.first')
         .find('.foo')
         .css('background-color', 'red')
         .end()
         .find('.bar')
         .css('background-color', 'green');

我只是不明白end()函数在这里扮演什么样的角色。

如果有人帮助我了解end()功能的使用情况，那就太棒了。简单的示例代码。请帮忙。感谢

Answer 1

the documentation中很好地解释了这一点：

结束当前链中最近的过滤操作，并将匹配元素集返回到先前的状态。

如果我像这样渲染代码，那就更清楚了：

$('ul.first')
    .find('.foo')
       .css('background-color', 'red')
    .end()
    .find('.bar')
       .css('background-color', 'green');

这意味着您将background-color设置为green的内容为ul.first .bar，而不是ul.first .foo .bar。它撤消该调用链中的.find('foo')过滤器。

等效的是：

$('ul.first').find('.foo').css('background-color', 'red');
$('ul.first').find('.bar').css('background-color', 'green');

Answer 2

初始选择器返回类ul的所有first元素。 .find('.foo')返回类foo的所有元素的子项，然后为它们设置红色的背景颜色。 .end()的使用会返回.find()之前的前一组元素 - 因此，同样具有类ul的所有first元素 - 然后查找具有该类的子元素bar。

Answer 3

描述：结束当前的最新过滤操作链并将匹配元素集返回到先前的状态。

我解释$('ul.first').find('.foo').css('background-color', 'red') .end().find('.bar').css('background-color', 'green');。您选择所有ul.first元素，然后从中选择所有.foo元素（并更改BG颜色）。接下来，您结束序列，以便“撤消”对.foo元素的搜索。现在，您搜索所有.bar元素，并更改其BG颜色。

end()的功能是停止搜索序列，并进行一级搜索。在示例中，如果没有end()，则不会有.bar个元素，因为HTML中没有ul.first .foo .bar元素。

jQuery'end（）'函数的用法

这是一个小例子

3 个答案: