第一百五十五章 第一个

如果我们只是想取出这个合集中的第一个元素，当然可以这么写 $('a')[0]，但是我们前面说了无数次，这样取出来的元素不能直接应用 jQuery 方法，还需要再包装一下，这就比较麻烦。

程序员很懒，所以直接设定了一个简单的操作，$('a').first()。这样就取出了这个合辑中的第一个元素，而且是可以直接使用 jQuery 方法的。

console.log( $('a').first().text() )

就像这个样子，这个方法让我们省去了包装的这一步。而且我们看上面的代码，jQuery 的方法是支持串联的，这可以让我们大幅度的简化代码。但也不要为了简化，而去刻意的使用。我们应该把代码控制在自己可以理解，可以准确控制的复杂度内。最开始先要以能够搞明白为主，随着对代码的熟悉再逐渐简练。

然后，我们要明确一点：这里所说的第一个，是整个合集中的第一个。而合集中的元素并不一定是具有相同父元素的，这和 :first-child 就有了区别。

那么讲到第一个，就出现了顺序的问题，这个顺序是怎样形成的呢？其实就是 jQuery 在网页代码中进行查找，如果元素匹配，就被加入这个合集。而查找的顺序是由外向内，由上向下（代码中的上下，而不是元素的显示位置）。像这种，我们可以自己设计一个案例，来试验一下，看看效果，这样更加有助于理解。

相应的，有了取出第一个元素的方法，当然也有取出最后一个元素的方法。$('a').last()。这都没啥好说的，反正把方法和选择器中的伪类区分一下就行。

两端的问题解决了，那么中间的元素如何取出呢？应该说如何方便的取出呢？于是又一个 $('a').eq(12) 方法，来取出指定序号的元素，这个要给一个参数，就是说我们要取出的是第几个元素，其他的用法和上面是一样的。有一个细节的问题，就是序号是从 0 开始的。这也很容易理解，因为这个合集类似于一个数组，而数组的序号就是从 0 开始的。记不住也没有什么关系，用的时候稍微试一下就可以了。

甚至我们可以给它设置负数，表示从后向前数。因为 0 已经是第一个元素的序号了，所以 -1 对应最后一个元素，-2 是倒数第二个元素，以此类推。

这是一个很方便的方法，省去了我们写遍历并判断序号的繁琐。但是我们怎么知道一个元素在这个合辑中的序号呢？

这是一个有趣的问题，jQuery 也为我们提供了一个方便的方法，就是 index()。但是这个方法有着许多的用法，并不容易记住，我们只通过例子来讲两种最简单的用法：

<ul><li>喵</li><li>喵</li><li>喵</li></ul><ul><li>喵</li><li id="miao">喵</li><li>喵</li></ul>

首先我们有上面的这样一个结构，现在我们要找到其中最特殊的那只喵，它在 $('li') 合集中的序号。写法有两种：

const miao = $('#miao');const i = $('li').index(miao);

首先获取我们要查找的这个元素对象，然后我们在这个合集里去查找这个对象的索引值。注意现在的参数是一个元素对象，嗯，包装好的。

const i = $('#miao').index('li');

或者反过来说，我们现在这个元素对象，它在后面这个选择器所选择的元素中排第几？现在的参数是一个选择器。

那么大家动手去看一下实际的效果，想一想为什么会获得这样的序号。