Question

如果这是重复的帖子，请告诉我，但我无法找到问题的解决方案。它必须简单......

我尝试使用javascript构建表单。表单的html如下：

<form>
  Time: <input type="time"> <br>
  Performer: <input type="text"><br>
  Link: <input type="text"><br>
  <input type="submit" value="Submit">
</form>

我尝试做的是使用javascript构建这个确切的表单，但元素都显示在同一行。这是我的javascript函数：

function addPerformance(){
var brk = document.createElement("br");
var form = document.createElement("form");

//create time element
var time = document.createElement("input");
time.setAttribute("type", "time");
form.appendChild(time);
form.appendChild(brk);

//create perfomer element
var perf = document.createElement("input");
perf.setAttribute("type", "text");
form.appendChild(perf);
form.appendChild(brk);

//create link element
var link = document.createElement("input");
link.setAttribute("type", "text");
form.appendChild(link);
form.appendChild(brk);

//create submit element
var sub = document.createElement("input");
sub.setAttribute("type", "submit");
sub.setAttribute("value", "Submit");
form.appendChild(sub);
form.appendChild(brk);

document.body.appendChild(form);
}

＆＃34; form.appendChild（BRK）＆＃34;是我认为会添加这些换行符，如在HTML示例中，但它不起作用。最后，我只希望表单中的每个元素都在一个列中。非常感谢任何帮助，谢谢！

Answer 1

当您第二次致电form.appendChild(brk);时，它会将brk引用的 HTMLElement 从其所在位置移动到新位置;即将其从第一位移除。

改为添加克隆

 form.appendChild(brk.cloneNode());

表格对象中的换行符

1 个答案: