.end()函数在jQuery中做了什么？

Question

我已经阅读了这个网页http://api.jquery.com/end/,但我仍然对.end()实际上做的事情一无所知.它是什么,你如何使用它？

我也正在阅读一本jQuery书,但它轻轻地釉了一下.end()并没有提供任何关于它的用途的例子.有人可以澄清吗？

Answer 1

$("body").find("span").css("border", "2px red solid");

VS

$("body").find("span").end().css("border", "2px red solid");

在Firebug控制台中单独执行这些语句,并注意这些行为的不同之处.基本上,.end()告诉它在找到所有跨度后回到身体,并将边界应用于身体,而不是跨度.如果我们没有.end()那里,jQuery代码基本上表现正常并将其应用于body中.css()的span元素.

BODY > SPAN > APPLY BORDER TO SPANS

随着end()它成为

BODY > SPAN > GO BACK TO BODY > APPLY BORDER TO BODY

这find()是一个破坏性操作,意味着它会更改jquery对象数组中的元素.

$('body') 

我们当前的元素是身体

$('body').find('span') 

我们使用了一个破坏性的操作find(),它改变了我们的整个对象集合,在体内填充了跨度,体内不再在集合中

$('body').find('span').end() 

因为find是一个"破坏性"操作,它回复到我们之前.find(),基本上是un- do 或ctrl-Z是改变我们的jquery集合的最后一件事.

Answer 2

它基本上回到父集.例如:

$('.tree')
    .find('.branch')
        .find('.leaf')
        .addClass('tacks-onto-leaf')
        .end()
    .addClass('tacks-onto-branch')
    .end()
.addClass('tacks-onto-tree');

Answer 3

它将链式JQuery语句的"范围"退回到上一级别.

jQuery对象中的标签最初为[$('P')]:P,P

找到[$('P')后找到jQuery对象中的标签.找到('SPAN')]:SPAN,SPAN,SPAN,SPAN,SPAN

结束后jQuery对象中的标签[$('P').find('SPAN').end()]:P,P

$('span')              //all <span> tags in the doc
  .find('#foo')          //all <span> with id foo
    .addClass('blinkyRed') //adds class blinkyRed <span id='foo'> 
  .end()                 //reverts scope to all <span> tags
.addClass('Bold')      //adds class Bold to all <span> tags

Answer 4

它允许当前的“范围”结束并重新定义。例如，假设您有一些 HTML，例如：

<div id="people">
 <ul>
   <li>A</li>
   <li>B</li>
 </ul>
 <ul>
   <li>C</li>
   <li>D</li>
  </ul>
</div>

您可以首先通过以下方式选择父级：

$('#people')

并修改子 ul 元素，例如

#('#people').find('ul').css('border', '1px solid #f00')

但是，如果您想继续编辑父元素 (#people)，会发生什么？你可以开始一个新的 finder $('#people') 或者只是将它链接到第一行，在 .end() 之前通知 jQuery 你想要“关闭” find() 并将搜索范围返回到在查找之前（隐含 $('#people')，像这样）

#('#people').find('ul').css('border', '1px solid #f00').end().css('border', '1px dashed #00f')

因此该行将：获取#people 的所有子 UL，将其边框更改为红色，然后将父 #people 元素的边框更改为虚线和蓝色。