JavaScript：如何在没有innerHTML的情况下替换元素内的代码

Question

我想替换JavaScript元素中的内容，但不能使用innerHTML和jQuery。

例如：

<div id="MyID">
<b>Hi,</b> how are you?<br />
I am fine.</div>

我想替换<div id="MyID">和</div>之间的所有内容。

就像通过innerHTML一样，我很难使用：

document.getElementById('MyID').innerHTML = document.getElementById('MyID').innerHTML.replace(/you/, '<a href="">you</a>');

将是：

<div id="MyID">
<b>Hi,</b> how are <a href="">you</a>?<br />
I am fine.</div>

如何做？

我尝试过类似[[appendChild和removeChild之类的事情，但我仍然无法弄清楚。

Answer 1

对于appendChild，您应该附加一个dom实体

Answer 2

使用remove（）清除现有内容，然后插入AdjacentHTML（）来输入新内容。这是您的代码示例作为示例。

<div id="MyID">
<span id="MyID2">
<b>Hi,</b> how are you?<br/>
I am fine.
</span>
</div>

<button onclick="myFunction()">Insert a paragraph</button>

<script>
function myFunction() {
var a = document.getElementById("MyID2");
a.remove();
var b = document.getElementById("MyID");
b.insertAdjacentHTML('afterbegin', '<b>Hi,</b> how are <a href="">you</a>?<br/>I am fine.');
}
</script>