如何使用jquery选择元素的所有先前兄弟元素？

Question

Let's say I have a div with next content:

<div id="divOne">
    <p>one</p>
    <p>two</p>
    <div id="aggregatedDiv"></div>
    <p> three </p>
</div>

So is there any way to remove first three elements? I don't know the number of elements. I just want to remove everything before id="aggregatedDiv" including it.

I have to append the result as html to some other div.

$("#otherDiv").append(resultOfSlicedDivOneHtml);

Answer 1

You can use .prevAll() to selecting all previous sibling of element and use .addBack() to adding previous selector ( #aggregatedDiv ) to current set of selected element.

 $("#aggregatedDiv").prevAll().addBack().css("color", "red"); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="divOne"> <p>one</p> <p>two</p> <div id="aggregatedDiv">#</div> <p> three </p> </div> 

If you want to add selected element to another element, use bottom example:

 $("#aggregatedDiv").prevAll().addBack().appendTo("#divTwo"); 

 #divTwo {color: red;} 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="divOne"> <p>one</p> <p>two</p> <div id="aggregatedDiv">#</div> <p> three </p> </div> <div id="divTwo"></div> 

Answer 2

如上所述，你可以使用.prevAll() ，但你也需要.addBack()来实现你想要的：

$("#otherDiv").append($("#aggregatedDiv").prevAll().addBack());

Answer 3

This should work:

var elements = $("#aggregatedDiv").prevAll(); //gets everything before aggregatedDiv
elements = elements.add($("#aggregatedDiv")); //we want aggregatedDiv in the collection as well
$("#otherDiv").append(elements); //move them all into the other div