Ajax 向表单添加动态数量元素的最佳方法？

我有一个复杂的表单，它有一个静态部分，一个可以有0到多个div，其中包含单选按钮、文本字段和文本区域

我想知道向具有可变表单输入量的部分添加元素的最佳方法是什么。我有一个可行的解决方案，但可能不是最好的： 我使用javascript添加一段html代码，并将其附加到包含可变数量输入字段的div中。在下面的代码示例中，我的javascript代码将执行以下操作

Javascript

document.getElementId('dynamic_form_stuff').innerHTML += "<div id='element3'>Form stuff</div>";

document.getElementId（'dynamic\u form\u stuff'）.innerHTML+=“form stuff”；

HTML

表单字段
单选按钮之类的东西
文本字段内容
文本区域内容
单选按钮之类的东西
文本字段内容
文本区域内容

我个人会做如下事情：

var elem = document.getElementId('dynamic_form_stuff');
var div = document.createElement('div'); // create element
div.setAttribute('class', 'myclass');  // define attributes
elem.appendChild(div);
// and/or more code.....

---

这使我能够更好地控制添加属性和样式。

我认为这在很大程度上取决于您在其他地方做了什么，添加了多少项，以及您希望如何添加事件处理程序

---

如果需要添加事件处理程序，我倾向于使用DOM方法更容易，但是如果您只是使用提交按钮添加表单，那么使用

innerHTML

会更快，如下所示：。

谢谢您的回答！所以我想我正处于那种“如果它没有坏，就不要修理它”的状态？只是看起来不太对劲，很难维护。sAc（如下）所示的解决方案在某种程度上更为简洁，但就像我有许多元素（表格、输入、图像等）一样令人困惑，这些元素将放在div“elements3”中。我有一堆元素要创建和附加，这取决于你是否要添加事件处理程序，或者你希望它以多快的速度呈现。这里有一些取舍。样式应该由css完成，在使用innerHTML时添加css很容易，但增加控件是一件好事，只要您不介意渲染时间更长。

var elem = document.getElementId('dynamic_form_stuff');
var div = document.createElement('div'); // create element
div.setAttribute('class', 'myclass');  // define attributes
elem.appendChild(div);
// and/or more code.....