我有一个带有元素的表单，我需要根据下拉值动态地为每个主表单元素创建一个包含更多元素的字段集/子表单。在表单元素的子表单之间移动时，我需要注意显示/隐藏子表单，同时保留子表单中的值。
您认为哪种方法高效？
在 DOM 中有 1 个子表单/字段集，并在 JS 内部维护一个主 JS 对象（如 JSON 的名称：值对），该对象将包含表单元素的信息，其子表单元素的数据和元数据提交时，只需发送将字符串化的 JS 对象发送到服务器。
此方法涉及每次需要添加新字段集或编辑字段集（用户认为已创建）时创建和删除 DOM 元素。
或者
在 DOM 中创建字段集的克隆，并在需要时执行 display:none/block。元数据将作为属性存储在子表单元素上，数据将在 DOM 本身中。在提交之前，循环遍历主表单元素的字段集中的子表单元素（使用选择器），构建一个类似的 JS 对象，字符串化并发送到服务器。
此方法涉及在 DOM 元素上设置属性，根据需要执行 display:none/block 以及在提交以形成主 JS 对象之前的最终循环。
截屏 ：
我不确定如何使用 jsperf.com 来了解上述两种方法之间的性能差异。
请分享你的想法。