如何在innerHTML中插入子元素

Question

我有一个缓冲区：

var buff="<div id='main'><p id='foo'>Hello World</p></div>"; 
var mydiv = document.createElement("div");
mydiv.innerHTML = buff; 
// Don't document.write mydiv, but do the operation below
mydiv.getElementById("foo").innerText = "Hi there!"; 

它目前不起作用，我该怎么办？

Answer 1

每个元素没有getElementById ，因为 ID 都是唯一的。 您使用querySelector / querySelectorAll进行元素范围查询，或document.getElementById按 ID 搜索文档

您可以使用mydiv.querySelector('#foo')或document.getElementById('foo')

Answer 2

object mydiv没有属性 function getElementById。

您需要像这样创建buff变量：

var buff="<div id='main'><p id='foo' class='bar'>Hello World</p></div>";

然后通过以下方式更改foo的内部文本：

mydiv.getElementsByClassName("bar")[0].innerText = "Hi there!"

希望这有帮助！