如何使用jQuery独立于文档的结构中获得最接近或以前的对象

Question

示例1：

<ul>
   <li id="o1" class="elem">foo1</li>
   <li id="o2" class="elem">foo2</li>
   <li id="o3" class="elem">foo3</li>
</ul>
**$('#o2').exactly_previous('.elem') ----> returns #o1**

示例2：

<ul>
   <li id="o1" class="elem">foo1
      <ul>
         <li id="o11" class="elem"></li>
      </ul>
   </li>
   <li id="o2" class="elem">foo2</li>
   <li id="o3" class="elem">foo3</li>
</ul>
**$('#o2').exactly_previous('.elem') ----> returns #o11
$('#o11').exactly_previous('.elem') ----> returns #o1**

示例3：

<ul>
   <li id="o1" class="elem">fooX</li>
</ul>
<ul>
   <li id="o2" class="elem">fooX</li>
</ul>
**$('#o2').exactly_previous('.elem') ----> returns #o1**

示例4：

<a id="o1" class="elem">fooX</a>
<ul>
   <li id="o2" class="elem">fooX</li>
</ul>
**$('#o2').exactly_previous('.elem') ----> returns #o1**

希望您理解我的问题！谢谢。

Answer 1

类似的东西：

function exactly_previous($this, selector)
{
    var $all = $(selector);
    return $all.eq($all.index($this)-1);
}

测试：

• http://jsfiddle.net/mattball/9au2h
• http://jsfiddle.net/mattball/9n7aq
• http://jsfiddle.net/mattball/3vguq
• http://jsfiddle.net/mattball/vbc87

将其转换为jQuery插件作为练习给读者。

Answer 2

为什么不看jquery .closest（）api。可能需要一些东西。

另外，还要查看.find（）API，这可能有助于穿越DOM对象。

Answer 3

尝试此

  $('#o2').parent().find('li').slice($('#o2').index() -1,$('#o2').index())

demo