можно использовать jQuery на элементах вне документа?

Question

Работа с какой-то устаревшей архитектурой и из-за характера последовательности инициализации мне нужно обернуть элемент перед его добавлением в документ.Скажем, у меня есть следующее:

<div id="containerX">
   <div id="myNode"></div>
</div>

И мне нужно обернуть «myNode», прежде чем он будет добавлен в DOM.Селекторы jQuery даже работают в этом контексте?Если так, как я могу сделать это?Я попытался передать элемент следующим образом:

(Исправлены некоторые опечатки, упомянутые здесь в некоторых ответах ниже):

$(this.element).wrap('<div id="'+ "myWrapper_" + this.id + '"></div>');

без удачи.Я предполагаю, что обычный синтаксис для селекторов не будет работать, так как узлы находятся за пределами документа.Самым близким, что я нашел, была эта запись здесь: Манипулировать элементами DOM перед добавлением их в документ , но разница между моей ситуацией и его состоянием в том, что у меня нет строк, у меня есть элементы, созданные с помощью документа.createElement, который не был добавлен.

Кто-нибудь может указать мне правильное направление или это вообще возможно?

Спасибо

Answer 1

Вы можете использовать Jquery и для других элементов, и я неоднократно использовал его для анализа ответа на запрос AJAX.

Хотя я не уверен, что ваш точный запрос возможен, я думаю, что главная проблема в вашем коде - это отсутствие < перед div, который вы пытаетесь обернуть вокруг своего элемента.

Answer 2

jQuery позволяет работать с элементами, которые еще не добавлены в документ. Они могут быть простыми строками HTML, а также элементами, созданными с помощью createElement().

Позвольте привести вам краткий пример:

var container=document.createElement('div');
container.id='containerX';
var mynode=document.createElement('div');
mynode.id='myNode';
container.appendChild(mynode);

$(container).find('#myNode').wrap('<div id="myWrapper'+mynode.id+'">');

Это должно привести к структуре, которую вы хотели. Вам просто нужно применить имена переменных. Я сделал это таким образом, потому что я не уверен, что ваш this.element содержит.

Пожалуйста, ознакомьтесь с jsFiddle Demo .

Answer 3

Во-первых, у вас есть ошибка в вашем коде.Вы пропускаете "+".Попробуйте это:

$(this.element).wrap('div id="' + myWrapper + this.id + '"></div>');

Обратите внимание на «+» перед «myWrapper».

Однако я думаю, что вы правы, вы не можете использовать перенос для элемента вне DOM.Вы всегда можете добавить его в DOM, а затем обернуть.И если вы не хотите, чтобы это было в DOM, тогда вызовите remove, чтобы вернуть его;конечно, это будет означать удаление его родителя, а не самого исходного элемента.Сам не пробовал все это, но это должно сработать.Вам нужно, чтобы у родителя (оболочки) был уникальный идентификатор, чтобы вы могли быть уверены, что захватите его.Еще одна вещь, похоже, вы хотите, чтобы у родителя был тот же идентификатор, что и у элемента, который вы переносите.Вы должны избегать присвоения одного и того же идентификатора двум элементам.Поэтому, если родитель получает идентификатор, его следует удалить из элемента.