動態地將列表元素添加到ul元素

Question

我想添加更多li元素，如第一個，動態地（即通過按下按鈕）。這裏是jsfiddle

一個沒有工作示例

document.onload = init; 
 
function init(){ 
 
    document.getElementById('add').onclick = add; 
 
} 
 
function add(){ 
 
    var el = document.getElementById('list'); 
 
    var node = document.createElement("li"); 
 
    var link = document.createElement("link"); 
 
    link.setAttribute('href', 'www.google.it'); 
 
    link.setAttribute('name', 'link'); 
 
    node.appendChild(link); 
 
    el.appendChild(node); 
 
}

<ul id="list"> 
 
    <li> 
 
    <a href="www.google.it">link</a> 
 
    </li> 
 
</ul> 
 
<button id="add">Add link</button>

Answer 1

固定小提琴這裏：https://jsfiddle.net/overlord_tm/jj3j356y/6/

你可能想創建一個a元素，而不是link。此外，您要設置innerText屬性，而不是name屬性。而作爲粘膠提到的，使用window.onload

Answer 2

window.onload = init; 
 
function init(){ 
 
    document.getElementById('add').onclick = add; 
 
} 
 
function add(){ 
 
    var el = document.getElementById('list'); 
 
    var node = document.createElement("li"); 
 
    var link = document.createElement("a"); 
 
    link.setAttribute('href', 'www.google.it'); 
 
    link.innerHTML = "link"; 
 
    node.appendChild(link); 
 
    el.appendChild(node); 
 
}

<ul id="list"> 
 
    <li> 
 
    <a href="www.google.it">link</a> 
 
    </li> 
 
</ul> 
 
<button id="add">Add link</button>