appendChild创建一个新节点

Question

我有这段代码：

var label = document.createElement("label");

var input_element = document.createElement("input");
input_element.setAttribute("type","checkbox");
input_element.setAttribute("name",val.x_name);
input_element.setAttribute("value",val.x_name);

label.appendChild(input_element);
label.innerHTML += val.x_display;

ta.form.appendChild(label);
ta.inputs.push(input_element);

重点是创建一个复选框元素，将其添加到表单中，然后将其填入数组中以便以后轻松检查。问题是，当我到达此代码的末尾时，input_element不会引用页面上存在的元素。我在Chrome的调试器中验证了这一点，input_element引用的元素与label元素的子元素不同。

Answer 1

input_element = label.appendChild(input_element);

Answer 2

我认为当您执行label.innerHTML += val.x_display;时会发生取消引用，因为您正在更改HTML字符串，从而导致重写DOM。

尝试

label.appendChild(input_element);
label.appendChild(document.createTextNode(val.x_display));