Копирование дочерних элементов одного подразделения в другое вместе со всеми связанными событиями - PullRequest
3 голосов
/ 06 июня 2011

Я пытаюсь заменить определенный элемент div parent другим newparent.Я хочу скопировать только некоторые из детей parent и поместить их в newparent, а затем заменить parent на newparent.Вот фрагмент моего кода:

var sb_button = parent.firstChild;
    var temp;
    while(sb_button) {
        console.log("loop: ");
        console.log(sb_button.id);
        temp = sb_button;
        if(sb_button.id != curr_button.id && sb_button.id != prev_button.id) {
            console.log("if");
            newparent.appendChild(temp);
            }
        else if(sb_button.id == curr_button.id) {
            console.log("elseif");
            newparent.appendChild(temp);
            newparent.appendChild(prev_button);
            }
        else {
            console.log("else");
            }
        sb_button.parentNode = parent;
        console.log(sb_button.id)
        console.log(sb_button.parentNode.children);
        sb_button = sb_button.nextSibling;
        }
    parent.parentNode.replaceChild(newparent,parent);

РЕДАКТИРОВАТЬ:

Так что, когда я делаю newparent.appendChild(temp), он модифицирует sb_button.Какой обходной путь для этого?

1 Ответ

4 голосов
/ 06 июня 2011

Я не запускал ваш код, но есть несколько странных вещей, возможно одна из которых может вызвать проблему или помочь прояснить код, чтобы проблема стала более очевидной.

  • переменная temp представляется псевдонимом для sb_button: вы можете удалить объявление переменной и заменить все ссылки на temp
  • sb_button - запутанное имя для произвольного дочернего узла
  • вы добавляете узел в sb_button к newparent в операторе if, но сразу после того, как пытаетесь установить sb_button_.parentNode в parent - это невозможно, так как parentNode только для чтения и это, конечно, не имеет смысла - вы не можете добавить элемент к одному элементу, но иметь другого родителя.
  • Вы пытаетесь скопировать или переместить узлы?

Редактировать: учитывая, что вы хотите скопировать узлы, я думаю, что вы ищете cloneNode: сделать копию узла и добавить эту копию, а не оригинал узел.

Что касается чистого дизайна, когда все усложняется, я бы избегал такого сложного для размышления цикла while. Вместо этого просто создайте массив узлов, упорядочите их так, как вы хотите (вы можете даже сделать это, используя sort, чтобы сразу стало ясно, что вы просто переставляете вещи), а затем создайте функцию, которая принимает newparent и массив и добавляет копии всех элементов в порядке массива к newparent. Ваш пример не так уж сложен, но даже здесь я бы изменил порядок предложений if, чтобы в последнем случае был регистр «по умолчанию». e.g.:

for(var child = parent.firstChild; child; child = child.nextSibling) 
    if(child.id == curr_button.id) { //insert prev_button after curr_button
        newparent.appendChild(child.cloneNode(true));
        newparent.appendChild(prev_button.cloneNode(true));
    } else if(child.id != prev_button.id) {
        newparent.appendChild(child.cloneNode(true));
    }
parent.parentNode.replaceChild(newparent, parent);

Идея состоит в том, чтобы сделать читателю сразу очевидным, что все дети обрабатываются ровно один раз.

...