Javascript 在不影响同级元素的情况下将html（文本）附加到元素？

我总是使用

appendChild

向其他元素添加内容，因为如果我使用：

innerHTML +=  'added stringgggggggggg';

然后，这会将动态元素（例如

）与填充值弄乱（它会将字段值重置为空）

在不使用JQuery的情况下，是否有任何较短的方法将smth添加到元素中，而不使用

appenChild

？

您可以使用它来计算原始HTML字符串并将其附加到元素中

element.insertAdjacentHTML('beforeend', '<p>put me inside at the end</p>');

与

innerHTML

不同，

insertAdjacentHTML（）

不会导致浏览器不会重新计算您注入的整个DOM节点，因此表单字段值将被保留

var parentEl=document.getElementById（'parent'）；
parentEl.insertAdjacentHTML（'beforeend'，'此段落插入表单末尾，但不影响表单字段值！）







添加文本不需要元素；只需使用文本节点。不过，我不知道有没有不使用
appendChild
（或
insertAdjacentHTML
等）的方法。只需创建一个helper函数并重用它，比如
appendText（元素，'added stringgggggg'））
这有帮助吗：-
appendChild
实际上是纯语法中最短的方法JS@rvighne当您必须使用
document.createTextNode
在使用
appendChild
@Vohuman之前创建一个textNode时，答案是否定的。这是我写的第一行。@Vohuman OP没有询问写快捷方式的问题函数或show以及他们试图编写的快捷方式函数的示例代码。我为浏览器行为提供了背景和上下文，这些行为为所有插入和附加方法提供了上下文。OP的示例可能会显示他们添加了一个“字符串”，我认为这是为了简洁，因为在此之前他们说“向其他元素添加一些东西”。我已经用
insertAdjacentHTML
方法更新了我的答案，因为这似乎满足OP的原始要求。这是一个很好的建议。我正要结束这个问题，作为这个问题的重复。我将删除我的评论。
<!-- beforebegin -->
<p>
  <!-- afterbegin -->
  foo
  <!-- beforeend -->
</p>
<!-- afterend -->