Как создать более одного элемента в DOM с js, используя для l oop? - PullRequest
Новая
       5

Как создать более одного элемента в DOM с js, используя для l oop?

1 голос
/ 12 марта 2020

Что ж, результат, который я хочу получить, состоит в том, что мой элемент div должен иметь то же количество элементов p, что и массив .

Чтобы сделать это, я попытался использовать for loop, но он просто создал один p элемент, поэтому я не работал.

У кого-нибудь есть идеи, как это сделать? (Я только учусь js). 

const diccionario = () => {
    var dama = ["bird:pajaro", "car:carro", "house:csa", "camis"];

    document.getElementById("dic").addEventListener("click", () => {
        var pes = document.createElement("p");
        for(var i = 0;  i < dama.length; i++){
            pes.innerHTML = dama[i];
            document.getElementById("cuadro").appendChild(pes);     
        }
    })
}

1 Ответ

2 голосов
/ 12 марта 2020

Вам необходимо создать элемент внутри l oop. Если вы создадите его вне l oop, то при вызове appendChild он будет удален из того места, где он был ранее в DOM: 

const diccionario = () => {
    var dama = ["bird:pajaro", "car:carro", "house:csa", "camis"];

    document.getElementById("dic").addEventListener("click", () => {
        for(var i = 0;  i < dama.length; i++){
            var pes = document.createElement("p"); // <----------------
            pes.innerHTML = dama[i];
            document.getElementById("cuadro").appendChild(pes);     
        }
    })
}

appendChild не создает копию существующего элемента - скорее, он просто добавляет к существующему элементу.

...