Как переместить элемент в DOM и на экране с помощью JavaScript или JQuery

Question

Допустим, у меня есть тег "p", подобный этому:

<div id = "example">
    <p id = "eg">This is a text example.</p>
</div>

Если я позже вставлю другие элементы в этот div, можно ли переместить тег абзаца куда-нибудь еще в dom, и он будет виден пользователю, где я его хочу. Таким образом, результат должен быть таким:

<div id = "example">
    <p id = "eg1">Another block of text.</p>
    <p id = "eg">This is a text example.</p>
    <p id = "eg2">Yet another block of text.</p>
</div>

Так что я не только хочу переместить его ... возможно, даже в другой раздел или другую область страницы, но я также хотел бы иметь возможность убедиться, что пользователь видит текст именно так, как я хочу его тоже ... может быть, переместился на дно или что-то.

Answer 1

Вы не можете точно "переместить" элементы в jQuery (насколько я знаю), per se , но вы можете удалить их и вставить их куда-нибудь еще.

$("#eg").remove().insertAfter("#eg1");

РЕДАКТИРОВАТЬ: Это не правда. Вы можете перемещать элементы DOM, куда хотите.

Answer 2

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

$("#eg1").after($("#eg"));

Пример для jsfiddle .

Answer 3

Любые изменения, внесенные вами в DOM, будут отражены на экране. Вам не нужно обращаться с этим отдельно.