jQuery метод присоединения к клонированному элементу после добавления в дерево DOM - PullRequest
0 голосов
/ 20 мая 2019

Просто быстрый вопрос о jquery-клонированном элементе. В течение долгого времени я думал, что мне придется повторно jqueryfy клонированный элемент после вставки его (в дерево DOM), но код ниже просто отлично работает.

HTML

<div id="test">test<"/div>
<button id="btn">push</div>

JavaScript

var $clone = $('#test').clone(),
    $btn = $('#btn');

$clone.prop('id','clone').appendTo('body');

// I thought this is necessary but it's not.
// var $clone = $('#clone');
$btn.on('click',function(){
  $clone.toggleClass('someclass');
});

Так может кто-нибудь сказать мне, почему?

1 Ответ

0 голосов
/ 20 мая 2019

На самом деле, если вы увидите документы для jQuery .clone() метода , этот метод создает глубокую копию набора подходящих элементов.

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

Вы можете понять:

var $clone = $('#test').clone();
// you created the copy of the $('#test') element and held it in $clone variable
$clone.attr('id','clone').appendTo('body'); // you should prefer prop() instead
// you changed it's id but it is still held in $clone
$clone.toggleClass('someclass');
// and you can toggle it's class as it is still held in $clone variable
...