Создание кнопок на чистом JS для вывода в input с помощью массива

Question

Я сделал массив кнопок, но при нажатии на любую кнопку выводит только 0 (то есть, конечное значение в массиве), получается я сделал массив для одной кнопки, как это исправить?

const input = document.createElement('input');
input.type = 'text';
document.body.append(input);

function printBtn() {
    var listBrand = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "0"];
  
    for (var i = 0; i < listBrand.length; i++) {
        var btn__1 = document.createElement("button");
        var t = document.createTextNode(listBrand[i]);
        btn__1.appendChild(t);
        document.body.appendChild(btn__1);

        btn__1.addEventListener('click', () => {
            input.value += btn__1.innerText;
            all = input.value.split('');
            console.log(all);
        });
    }
}

printBtn();

Answer 1

Надо написать не

var btn__1 = document.createElement("button");

а

let btn__1 = document.createElement("button");

А лучше уже давным давно забыть про var.

И почитать отличие var, let, const

Answer 2

const input = document.createElement('input');
input.type = 'text';
document.body.append(input);

function printBtn() {
    let listBrand = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "0"];
  
    for (let i = 0; i < listBrand.length; i++) {
        let btn__1 = document.createElement("button");
        let t = document.createTextNode(listBrand[i]);
        btn__1.appendChild(t);
        document.body.appendChild(btn__1);

        btn__1.addEventListener('click', () => {
            input.value += btn__1.innerText;
            all = input.value.split('');
            console.log(all);
        });
    }
}

printBtn();

БЛОГ НА HUSL

Создание кнопок на чистом JS для вывода в input с помощью массива

Ответы (2 шт):