如何使用Javascript将输入字段附加到表单？

Question

使用javascript，我创建了一个名为form的隐藏表单。它的代码是这样的：

var form = document.createElement("form");
document.body.appendChild(form);
form.method = "POST";
form.action = targetUrl;
form.target = "_blank";

另外，我创建了一个名为element1的输入字段，如下所示：

var element1 = document.createElement("INPUT");
element1.name="my_text"
element1.value = "blablabla";
element1.type = "hidden";
form.submit();

我缺少的是将我创建的输入元素附加到表单中。

我怎么能这样做？

我尝试过使用element1.appendTo('form');但是出了点问题。

注意：我故意避免使用JQuery。

Answer 1

您已将表单附加到正文，为什么不使用相同的代码附加到表单的输入？

form.body.appendChild(element1);

请注意，您必须在提交表单之前附加输入。

Answer 2

如果您正在处理超出小片段的这些元素，并且需要在当前范围之外访问它们，那么您可能需要给它们一个id。

你可以这样做：

form.setAttribute("id", "hiddenForm");
element1.setAttribute("id", "hiddenElement");

使用该ID，您可以使用DOM API来访问它们：

var frm = document.getElementById("hiddenForm");
var elm = document.getElementById("hiddenElement");

要将孩子的任何内容附加到其他任何内容上，请执行以下操作：

// parentNode.appendChild(childNode);
frm.appendChild(elm);

Answer 3

为什么只用一行代码就可以使用如此多的代码： -
HTML：

<div id="form"></div>

JavaScript的：

document.getElementById("form").innerHTML="put your whole form code here";