更新Innertext而不删除子节点

Question

我有一个带有一些文字和一个孩子的div。我想更新外部div文本并保留孩子div

<div class="outer">
  some text here
<div class="arrow-down"></div>
</div>

如果我尝试outer.innerText = "foo"，则删除了箭头元素。我该如何解决这个问题？

谢谢

Answer 1

创建一个儿童元素，例如 span元素，并将您想要更改的文本放在其中。

然后，您可以通过JavaScript这样更新它：

var el = document.getElementById('inner');
el.innerText = 'some different text';

<div class="outer">
  <span id="inner">some text here</span>
  <div class="arrow-down"></div>
</div>