Question

我想通过在同一页面上按下一个按钮来创建HTML元素，但是单击后该元素不会出现。

我的HTML：

<button type="submit" name="e-h1" onclick="CreateNewDom">H1 Überschrift</button>
<form id="editor" method="post">
</form>

和我的JS：

function CreateNewDom() {
var DOMHeadingOne = document.createElement("input");
DOMHeadingOne.setAttribute("type", "text");
DOMHeadingOne.classList.add("e-h1");
document.getElementById("editor").appendChild(DOMHeadingOne);
}

我的目标是能够创建自定义表单，因此我将需要能够通过单击它们各自的按钮来创建多个Elements。由于我是一个新手，所以我无法解决问题的正确方法。

欢迎提供有关最终方法的提示。

编辑：问题已解决。我不小心混淆了两种解决问题的方法。代码可以像这样正常工作： HTML：

<button name="e-h1" onclick="CreateNewDom()">H1 Überschrift</button>
<form id="editor" method="post">
</form>

JS：

function CreateNewDom() {
var DOMHeadingOne = document.createElement("input");
DOMHeadingOne.setAttribute("type", "text");
DOMHeadingOne.classList.add("e-h1");
document.getElementById("editor").appendChild(DOMHeadingOne);
}

Answer 1

您没有在HTML中正确调用该函数。将onclick="CreateNewDom"更改为onclick="CreateNewDom();"可解决此问题

function CreateNewDom() {
var DOMHeadingOne = document.createElement("input");
DOMHeadingOne.setAttribute("type", "text");
DOMHeadingOne.classList.add("e-h1");
document.getElementById("editor").appendChild(DOMHeadingOne);
}

<button type="submit" name="e-h1" onclick="CreateNewDom();">H1 Überschrift</button>
<form id="editor" method="post">
</form>

Answer 2

在下面使用

 onclick="CreateNewDom()"

使用按钮创建HTML元素

2 个答案: