массив итерации только выполняет AppendChild раз

Question

У меня есть реальный вопрос новичка для всех вас:

У меня есть этот цикл:

var pNewTag = document.createElement('p'); 
var grabWrapper = document.querySelector('.footerInfo'); 
var myArray = grabWrapper.children; 

for (var i = 0; i < myArray.length; i++) { 
    grabWrapper.children[i].appendChild(pNewTag); 
    pNewTag.innerHTML = " this works "; 
} 

Массив Я работаю с имеет длину 7, но цикл только делает appendChild один раз. Я бы хотел, чтобы он работал на каждой итерации. Что мне не хватает?

Answer 1

Это потому, что у вас есть только один элемент, и продолжать двигаться вокруг, вы должны создать один элемент для каждой итерации

var grabWrapper = document.querySelector('.footerInfo'); 
var myArray = grabWrapper.children; 

for (var i = 0; i < myArray.length; i++) { 
    var pNewTag = document.createElement('p'); 
    pNewTag.innerHTML = " this works "; 

    grabWrapper.children[i].appendChild(pNewTag); 
} 

Answer 2

Вы должны создать несколько p -элементов:

var grabWrapper = document.querySelector('.footerInfo'); 
var myArray = grabWrapper.children; 

for (var i = 0; i < myArray.length; i++) { 
    var pNewTag = document.createElement('p'); 
    pNewTag.innerHTML = " this works "; 
    grabWrapper.children[i].appendChild(pNewTag); 
} 

Try, чтобы заполнить элемент, прежде чем добавить его в документ. Таким образом, ваш браузер не должен дважды оплатить документ.