如何在不进入较低级别的情况下在jQuery中选择同级

Question

如何在不深入结构的情况下获得特定元素（在这种情况下是PLACEHOLDER元素）的同级元素？我尝试了$（"#PLACEHOLDER"）.siblings（），但这也让我获得了C和Dli元素。我需要一种方法来让兄弟姐妹达到那个水平（这里是a、B和E）。

<section id="root">
    <ol class="sortable">
        <li id="A"><div>A</div></li>
        <li id="B"><div>B</div>
            <ol>
                <li id="C"><div>C</div></li>
                <li id="D"><div>D</div></li>
            </ol>
        </li>
        <li id="E"><div>E</div></li>
        <li id="PLACEHOLDER"><div>PLACEHOLDER</div></li>
    </ol>
</section>

Answer 1

如果选择$('#PLACEHOLDER').siblings().andSelf()，它应该只提供#A、#B、#E和#PLACEHOLDER。

jsFiddle。

您的siblings()调用可能已获得#C和#D元素的原因是，您的基本选择器可能是.sortable li，而它本应是.sortable > li。

Answer 2

$('#PLACEHOLDER').siblings()工作得很好，只得到A、B和E，正如Alex指出的那样，这只是父对象的背景色。

http://jsfiddle.net/d4udts/W9cCE/1/

如果你想在占位符上方选择一个同级，你可以这样做

$('#PLACEHOLDER').prev();

http://jsfiddle.net/d4udts/W9cCE/2/

它只给你上一个兄弟姐妹，如果你想要所有上一个的兄弟姐妹，你可以使用prevAll()

http://api.jquery.com/category/traversing/

Answer 3

试试这个。

http://jsfiddle.net/5aFHQ/11/

.text()函数返回选择器内的所有文本，因此您的代码也返回C和D。获取选择器的子元素，然后调用.text()