배열에 대한 appendChild는 마지막 요소에만 추가합니다.

Question

나는 아직도 자바 스크립트의 초보자입니다. 왜 Text 노드를 한 번만 추가 할 수 있습니까? 다른 곳에 다시 추가하면 첫 번째 아이콘이 사라집니다.

문제에 대한 해결책이 필요하지 않습니다.이 문제의 원인이 무엇인지 궁금했습니다. textnode은 배열의 마지막 요소에 추가됩니다 예 :

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입니다 나무입니다 :

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);  
    } 
} 

이것은 당신이 독특한 textnode를 사용하는 곳 작동하므로입니다 , 네트워크가 아닙니다. 각 노드에는 하나의 상위 노드 만있을 수 있습니다. 두 개 이상의 위치에 노드를 추가 할 수있는 경우 하나 이상의 부모가 있습니다.