使用jQuery选择具有特定类的第一个和最后一个元素

Question

我有一个特殊类"地方"的跨度列表,其中一些有"激活"类.有没有办法选择"激活"类和最后一个类的第一个项目？

<span class="place" onclick="activate();">1</span>
<span class="place" onclick="activate();">2</span>
<span class="place activated" onclick="activate()">3</span>
<span class="place activated" onclick="activate();">4</span>
<span class="place activated" onclick="activate();">5</span>
<span class="place activated" onclick="activate();">6</span>
<span class="place" onclick="activate();">7</span>

Answer 1

var firstspan = $('span.activated:first'),
    lastspan = $('span.activated:last');

顺便说一句,如果您使用的是jQuery,那么所有内联点击事件都有什么用？

您可以像这样添加一些代码:

$('span.place').click(function() {
    activate(); // you can add `this` as a parameter
                // to activate if you need scope.
});

Answer 2

var places = $('span.place.activated');

var first = places.first(),
    last  = places.last();

说明:span.places.activated选择器将<span>使用"place"和"activate"类获取所有s.然后,first()和last()方法将返回该集合的第一个和最后一个项目.这是优于使用:first,并:last因为选择价格昂贵,这样一来,我们只能做一次选择,然后依靠(便宜)数组操作,以获得第一和最后一个元素pseudoselectors.