javascript - 使用 DOM 创建并填充一个复选框列表，其中包含 javascript 中的数组值

Question

我有一组动物...我如何设法在 javascript 中创建一个复选框列表，并用动物数组中的动物名称填充每个复选框，并在 html 中显示它们。我的尝试代码:

var lengthArrayAnimals = animals.length;
for (var i= 0; pos < tamanhoArrayDiagnosticos; pos++) {
    var checkBox = document.createElement("input");
    checkBox.setAttribute("type", "checkbox");
    checkBox.name = diagnosticos[i];
}

Answer 1

这是一种方式(纯 JavaScript，无 jQuery):

var animals = ["lion", "tigers", "bears", "squirrels"];

var myDiv = document.getElementById("cboxes");

for (var i = 0; i < animals.length; i++) {
    var checkBox = document.createElement("input");
    var label = document.createElement("label");
    checkBox.type = "checkbox";
    checkBox.value = animals[i];
    myDiv.appendChild(checkBox);
    myDiv.appendChild(label);
    label.appendChild(document.createTextNode(animals[i]));
}

https://jsfiddle.net/lemoncurry/5brxz3mk/