javascript - 获取选择器中的第一个和最后一个对象

Question

我的例子:

<div id="main">
    <div class="here" id="dsf">a</div>
    <div class="no" id="sdf">b</div>
    <div class="here" id="sdfsdf">c</div>
    <div class="here" id="dssdf">d</div>
    <div class="no" id="ds3f">e</div>
    <div class="here" id="ds4f">f7</div>
    <div class="no" id="tert4">b8</div>
    <div class="no" id="r4tt4">5c</div>
    <div class="here" id="ert4">d4</div>
    <div class="no" id="fdgd4">e3</div>
    <div class="here" id="fghf3">2f</div>
</div>

var rand = Math.floor((Math.random() * 10) + 1);
if(rand > 5){
    var here = $('div div.here');
} else {
    var here = $('div div.no');
}

console.log(here);

如何从“这里”获取第一个和最后一个元素？我想获取这些元素的 ID。

fiddle :http://jsfiddle.net/5BfPL/2/

Answer 1

您可以使用 jQuerys .first()和 .last() .

.first() : 将匹配元素的集合减少到集合中的最后一个。
.last() : 将匹配元素的集合减少到集合中的第一个。

有了这些，您可以选择检索元素。您可以只使用 .prop() 或 .attr()(取决于您的 jQuery 版本)来获取 id。

示例:

var firstElement = $('div div.here').first().prop('id');

var lastElement = $('div div.here').last().prop('id');

JsFiddle

更新

根据您在评论中的要求，您可以使用 .eq() 获取第三个元素

.eq() : 将匹配元素的集合减少到指定索引处的元素。

示例:

var thirdElement= $('div div.here').eq(2); // the parameter is 0-based.