使用 javascript DOM document.createElement 在新行上创建 <select> 表单

Question

我需要在按下按钮时在新行上创建表单，使用 javascript 和 document.createElement。当我这样做时，它会不断地在同一行上创建新表单。

为了更好地解释问题我给你一个link到jsfiddle.net

function myFunction() {
   var select = document.createElement("select");
   document.getElementById("list").appendChild(select);
}

https://jsfiddle.net/cnenms77/2/

Answer 1

您直接添加了 select 个没有 li 标签的标签。无效。正确的方法是使用 li 标签。

阅读 UL 标签标准 here。

也读一下这个Whosebug question。

默认 li 标签从新行开始。所以结构应该是

<ul id="list">
     <li><select></select></li>
     <li><select></select></li>
     <li><select></select></li>
</ul>

在 javascript 中创建 li 元素，然后将 select 标记附加到它。然后您可以添加元素 ul 列表。 preview

function myFunction() {
    var select = document.createElement("select");
    var li = document.createElement("li");
    li.appendChild(select);
    document.getElementById("list").appendChild(li);
}

使用 javascript DOM document.createElement 在新行上创建 <select> 表单

Creating <select> forms on new lines with javascript DOM document.createElement

html

javascript

createelement