Как выбрать все предыдущие родственные элементы элемента с помощью jquery?


Допустим, у меня есть div со следующим содержанием:

<div id="divOne">
    <p>one</p>
    <p>two</p>
    <div id="aggregatedDiv"></div>
    <p> three </p>
</div>
Так есть ли способ удалить первые три элемента? Я не знаю количества элементов. Я просто хочу удалить все до id="aggregatedDiv" включая его.

Я должен добавить результат в виде html к некоторым другим div.

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

3 ответа:

Вы можете использовать .prevAll() к выбору всех предыдущих родственных элементов и использованию .addBack() к добавлению предыдущего селектора (#aggregatedDiv) в текущий набор выделенного элемента.

$("#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>

Если вы хотите добавить выбранный элемент к другому элементу, используйте Нижний пример:

$("#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>

Как уже упоминалось выше, вы можете использовать .prevAll(), но также вам понадобится .addBack(), чтобы достичь того, что вы хотите:

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

Это должно сработать:

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