.end()
.end()
描述：结束当前连缀中最近的一个筛选操作，并把匹配的元素集合返回到它的上一个状态。
该方法不接受任何参数
大多数jQuery的DOM遍历方法操作在jQuery对象实例上，并制作一个新实例，匹配一个不同的DOM元素集合。当发生这时，它就像一个新的元素集合被推加到栈上，栈保留在对象内部。每个依次的筛选器方法把一个新元素集合推加到栈上。如果我们需要一个旧的元素集合，可以使用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>
可以在jQuery的连缀属性中利用.end()方法。在不使用连缀的时候，我们经常会利用变量来调出前一个对象，因此我们不需要操纵堆栈。然而，利用.end()方法，我们可以把所有的方法调用串到一起：
$( "ul.first" )
.find( ".foo" )
.css( "background-color", "red" )
.end()
.find( ".bar" )
.css( "background-color", "green" );
该连缀搜索了第一个列表内部带有样式类foo的项目，并把它们的背景色变成红色。然后.end()把jQuery对象变回到它调用.find()之前的对象，因此第二个.find()方法查找了<ul class="first">内部带有样式类bar的项目，而并不只在<li class="foo">中查找，并把匹配的元素的背景变绿。结果是第一个列表的项目1和项目3得到了着色的背景，第二个列表中没有项目发生改变。
一个长的jQuery连缀可以可视化为一个结构代码块，筛选方法提供了嵌套块的进口，而.end()方法关闭了它们：
$( "ul.first" )
.find( ".foo" )
.css( "background-color", "red" )
.end()
.find( ".bar" )
.css( "background-color", "green" )
.end();
最后的.end()是不必要的，因为我们在此之后立即丢弃了该jQuery对象。然而，当代码写成这种形式时，.end()提供了视觉的对称性，以及完整感——使编程，至少在一些开发员眼中，变得更可读，作为代价是损失一点点性能，因为它是一个额外的函数调用。
示例
选择所有的段落文本，找到它们里面的<span>元素，并把选区返回到段落文本。
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>end demo</title>
<style>
p, div {
margin: 1px;
padding: 1px;
font-weight: bold;
font-size: 16px;
}
div {
color: blue;
}
b {
color: red;
}
</style>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<p>
Hi there <span>how</span> are you <span>doing</span>?
</p>
<p>
This <span>span</span> is one of
several <span>spans</span> in this
<span>sentence</span>.
</p>
<div>
Tags in jQuery object initially: <b></b>
</div>
<div>
Tags in jQuery object after find: <b></b>
</div>
<div>
Tags in jQuery object after end: <b></b>
</div>
<script>
jQuery.fn.showTags = function( n ) {
var tags = this.map(function() {
return this.tagName;
})
.get()
.join( ", " );
$( "b:eq( " + n + " )" ).text( tags );
return this;
};
$( "p" )
.showTags( 0 )
.find( "span" )
.showTags( 1 )
.css( "background", "yellow" )
.end()
.showTags( 2 )
.css( "font-style", "italic" );
</script>
</body>
</html>
演示结果
选择所有的段落文本，找到它们内部的<span>元素，并把选区返回到段落文本。
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>end demo</title>
<style>
p {
margin: 10px;
padding: 10px;
}
</style>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<p><span>Hello</span>, how are you?</p>
<script>
$( "p" )
.find( "span" )
.end()
.css( "border", "2px red solid" );
</script>
</body>
</html>
演示结果