贯穿jQuery的内部栈（一） -- 使用

非常感谢大家的理解和支持，就在今天，本公众号收到了微信官方的邀请 -- 声明原创功能，这无疑是给我带来一付强心剂。现在大家就可以在公众号下方留言了。

今天分享的内容是藏于jQuery内部的栈，所起栈相信大家都不太陌生，若有不懂的可以查询相关资料。

栈简单来说就是按照一定规则存取东西的容器，就像羽毛球筒（这边进那边出），又比如。。。（这边进，这边出）。

我特别喜欢《JavaScript权威指南》这本书（选取的某个页面元素），但是呢，只喜欢在公司（js脚本文件）看书，买回来的书被快递员放到了我家里（html页面）。我总不能每次看的时候，把书从家里带到公司，不看的时候还拿回家吧？这样多麻烦（我保证，在家是绝对不会看书的，也就是元素用完扔掉，下次用再去取）。

这就产生了以下两个思考：

1. 当我多次想看书的时候，怎么样才能一直看到，不必在公司与家之间来回带（那本书多重啊，光页码就有1000+）？答案肯定是放在公司

2. 即使我只看那么一次，我不把书拿回家也不会太影响吧（拿回家也是在那儿扔的，没什么用）？

jQuery在内部使用了栈，用来存放从页面中选取到的元素。当多次用到某个元素时，不需要多次从页面获取（jQuery获取元素是很费劲的，尤其是根据ID查找）。

一、例如end()：

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

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

上面例子也涉及到了jQuery的链式操作。

大多数jQueryDom遍历方法来操作jQuery对象实例，并创建一个新的对象，匹配一个不同的DOM元素集合。当发生这种情况时，实际上是新的元素集合被压入到对象内部维护的栈中。每次过滤方法都会被压入栈中，当我们需要返回到前一个状态时，可以使用end()进行出栈操作，来返回前一个状态。 ---- 引用自 http://www.css88.com/jqapi-1.9/end/index.html

二、addBack()

<ul>   <li>list item 1</li>   <li>list item 2</li>   <li class="third-item">list item 3</li>   <li>list item 4</li>   <li>list item 5</li></ul>

$('li.third-item').nextAll().addBack()  .css('background-color', 'red');

解释：首先，初始选择位于第3项，初始化堆栈集合只包含这项。调用.nextAll() 后将第4和第5项推入堆栈。最后，调用.addBack() 合并这两个组元素在一起，创建一个jQuery对象，指向所有三个项元素（按照文档中的顺序）：{[<li.third-item>,<li>,<li> ]}。

大伙可以先自己在源码中找到这块相关的代码，很多都有涉及。

之后会详解jQuery源码，jQuery内部栈是如何实现的。