appendChild к массиву добавляет только последний элемент

Question

Как вы можете видеть, я все еще новичок в JavaScript Почему вы можете добавить текстовый узел только один раз? Когда вы добавляете его снова где-то еще, первый исчезает

Мне не нужно решение проблемы, мне просто было любопытно, что вызывает такое поведение. Пример, в котором текстовый узел добавляется только к последнему элементу массива:

function hideAdd(){
    var hide = document.createTextNode('Afbeelding verbergen');
    var afb = collectionToArray(document.getElementsByTagName('img'));  
    afb.pop();
    var divs = [];
    for (i=0; i < afb.length; i++){
        divs.push(afb[i].parentNode);

    }
    console.log(divs);
    for ( i = 0; i < divs.length;i++){
        divs[i].appendChild(hide);      
    }
}

Здесь вы используете уникальный текстовый узел, чтобы он работал:

function hideAdd(){
    var hide = []
    var afb = collectionToArray(document.getElementsByTagName('img'));  
    afb.pop();
    var divs = [];
    for (i=0; i < afb.length; i++){
        divs.push(afb[i].parentNode);
        hide[i] = document.createTextNode('Afbeelding verbergen');

    }
    console.log(divs);
    for ( i = 0; i < divs.length;i++){
        divs[i].appendChild(hide[i]);       
    }
}

Answer 1

Краткий ответ: DOM - это дерево, а не сеть.Каждый узел может иметь только одного родителя.Если бы вы могли добавить узел более чем в одном месте, у него было бы более одного родителя.