append в jQuery
 

Имеется коллекция элементов jQuery. Коллекция встраивается в DOM. Нужно, чтобы при добавлении элемента в коллекцию, он бы добавлялся к оставшимся элементам в DOM.

Делаю так:

var $coll = $(<p>коллекция</p>)
$('div').append($coll)

//Добавляется элемент в коллекцию и сразу встраивается в  DOM
$('div').append($coll.add($(<p>добавка</p>)))

Вопрос. Что происходит, когда аппендится один и тот же объект (в нашем случае $coll)? Удаляется из DOMa старый, и записывается новый такой же. Или существующие объекты не затрагиваются?

расследование и ответ снизу.

да. они просто перемещаются :

<div id="from" style="border: 1px red solid;">  <div id="target">FOOBAR</div> </div>
<div id="to" style="border: 1px green solid;"></div>

<script>
// сокращение
var $ = document.getElementById.bind(document);

// добавим какое-нибудь свойство к элементу :
$("target").myprop = "myvalue";

// по клику будем выводить значение этого свойства :
$("target").addEventListener("click", function (e) {
    alert( 'Значение свойства "myprop" :  ' + this.myprop);
});

// теперь переместим элемент в другой элемент.
$("to").appendChild( $("target") );
</script>

А вот что происходит с элементом, если его appendChild'ят в то же место, где он находится - вопрос.

Попробую полазить щас в исходниках V8 ... самому интересно стало :)

Node.appendChild отсылает нас к ContainerNode::appendCild, где после проверок на возможность вставки \ перемещения элемента (можем ли мы манипулировать вообще с ним) происходит проверка на то, одинаков ли this и цель вставки ( т.е. пытаемся ли мы вставить элемент сам в себя), всё-таки он вынимается из дерева и вставляется в родитель.

т.е. они каждый раз вынимаются из дерева, и вставляются на то же место.

это ненужная операция, которой нужно избегать.

Спасибо за расследование! Именно этого я и боялся. Как же сделать так, чтобы при пополнении коллекции пополнялся бы и ДОМ без перезаписи старых элементов?

Мне тут видится несколько вариантов:
1. Отойти от коллекции и каждую вставку клонировать в новый объект jQuery (так делал раньше). Но плодить кучу однородных клонов... наверное, не очень хорошо.
2. Вытаскивать новую вставку из объекта jQuery и аппендить напрямую. $('to').append($('target')[0].outerHTML). Но потом не получится изменить свойства вставки средствами jQuery (без поиска ее по ДОМу), так что тоже плохой вариант.
3-й способ еще не придумал. Кто-нибудь знает решение?

у JQ есть метод appendTo - отличный вариант.

А разве это не то же самое. что и append только с другим порядком следования элементов? Или в этом случае не используется appendChild?Ф