如何将appendChild追加到文本字段？

Question

我正在尝试创建一个文本字段，该字段接收用户输入并创建标记（如果它是有效的电子邮件ID）。

我使用appendChild()方法在创建标签后附加标签，但我无法这样做。

以下是将<span>附加到字段的代码：

HTML

<textarea id="customField" class="mdl-textfield__input" type="text" rows="1"></textarea>

JS

document.getElementById("customField").appendChild(spanParent);

我不确定这是否是正确的做法，但如果有人可以提供帮助，那就太好了。

Answer 1

您不能将appendChild()与输入字段一起使用，而是与该输入字段的容器一起使用，请参阅此处的实时操作：https://jsfiddle.net/37b2fa2e/2/。

您还应该考虑使用insertBefore()方法，这有助于将引用节点之前的指定节点插入当前节点的子节点。

Answer 2

根据@sonlexqt在评论中建议我们无法附加到<input>代码，我们必须使用<div>创建contenteditable=true，并且可以将任何<div>附加到<input> 1}} field。