Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 12.10.2012, 22:12
Профессор
Отправить личное сообщение для Shitbox2 Посмотреть профиль Найти все сообщения от Shitbox2
 
Регистрация: 04.10.2010
Сообщений: 571

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

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

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

Вопрос. Что происходит, когда аппендится один и тот же объект (в нашем случае $coll)? Удаляется из DOMa старый, и записывается новый такой же. Или существующие объекты не затрагиваются?
Ответить с цитированием
  #2 (permalink)  
Старый 12.10.2012, 22:41
sinistral
Посмотреть профиль Найти все сообщения от melky
 
Регистрация: 28.03.2011
Сообщений: 5,418

Сообщение от Shitbox2
Или существующие объекты не затрагиваются?
расследование и ответ снизу.

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

<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 и цель вставки ( т.е. пытаемся ли мы вставить элемент сам в себя), всё-таки он вынимается из дерева и вставляется в родитель.

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

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

Последний раз редактировалось melky, 12.10.2012 в 23:04.
Ответить с цитированием
  #3 (permalink)  
Старый 13.10.2012, 10:39
Профессор
Отправить личное сообщение для Shitbox2 Посмотреть профиль Найти все сообщения от Shitbox2
 
Регистрация: 04.10.2010
Сообщений: 571

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

Мне тут видится несколько вариантов:
1. Отойти от коллекции и каждую вставку клонировать в новый объект jQuery (так делал раньше). Но плодить кучу однородных клонов... наверное, не очень хорошо.
2. Вытаскивать новую вставку из объекта jQuery и аппендить напрямую. $('to').append($('target')[0].outerHTML). Но потом не получится изменить свойства вставки средствами jQuery (без поиска ее по ДОМу), так что тоже плохой вариант.
3-й способ еще не придумал. Кто-нибудь знает решение?
Ответить с цитированием
  #4 (permalink)  
Старый 13.10.2012, 10:44
sinistral
Посмотреть профиль Найти все сообщения от melky
 
Регистрация: 28.03.2011
Сообщений: 5,418

у JQ есть метод appendTo - отличный вариант.
Ответить с цитированием
  #5 (permalink)  
Старый 13.10.2012, 15:32
Профессор
Отправить личное сообщение для Shitbox2 Посмотреть профиль Найти все сообщения от Shitbox2
 
Регистрация: 04.10.2010
Сообщений: 571

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



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Вопрос поддержки старых методов jQuery antonM jQuery 1 04.10.2012 00:08
jquery is not defined - странный случай tarya jQuery 2 16.07.2012 14:27
JQuery Проблема с append после клонирования талицы vuler Общие вопросы Javascript 0 04.04.2012 00:28
2 разных модуля на jQuery - как подключить? finder jQuery 4 23.03.2012 22:29
Помогите разобратся с Jquery append unsiker jQuery 3 08.07.2011 22:06