簡單添加到列表中未工作

-2

我有一個簡單的腳本通過一個按鈕添加到UL，但它不工作簡單添加到列表中未工作

<input type = "text" id ='textbox'/> 
<button onclick="addPeople()">Add Players</button> 
<ul id='myList'></ul> 

<script> 
function addPeople() { 
    var text = document.getElementById("textbox").value; 
    var li = "<li>" + text + "</li>"; 
    document.getElementById("myList").appendChild(li); 
} 
</script>

可有人點我在正確的方向？

來源

2015-06-09 Justin

您應該在發佈之前進行搜索。看到這個：http://stackoverflow.com/questions/17773938/add-a-list-item-through-javascriptand還有很多其他人爲你參考。另請參閱：http：//stackoverflow.com/help –

這不是appendChild的有效節點，它只是一個字符串。 'var li =「

」+ text +「

」;' – colecmc

'document.getElementById（「myList」）。innerHTML + = li;' – Drakes

您不能將字符串作爲子項追加到列表中。
你必須創建一個新的li元素並添加它。
這應該做的伎倆：

function addPeople() { 
    var text = document.getElementById("textbox").value; 
    var ul = document.getElementById("myList"); 
    var li = document.createElement("li"); 
    li.appendChild(document.createTextNode(text)); 
    ul.appendChild(li); 
}

來源

2015-06-09 00:28:36

工作。謝謝！ – Justin

的一種方法，使這項工作是改變

document.getElementById("myList").appendChild(li);

到

document.getElementById("myList").innerHTML += li;

因爲li是不是一個節點，它是一個字符串。

的Node.appendChild（）方法增加了一個節點到指定的父節點（ref）的孩子的列表的末尾。

如果你想附加一個HTML片段（你的字符串），你可以使用上面的方法。 Demo

來源

2015-06-09 00:31:01 Drakes

簡單添加到列表中未工作

回答

相關問題