的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引用的元素與標籤元素的子元素不同。

Answer 1

我覺得當你做label.innerHTML += val.x_display;因爲你改變了HTML字符串，從而導致DOM重寫反引用發生。

嘗試

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

Answer 2

input_element = label.appendChild(input_element);