javascript - 获取 JavaScript 中元素的每个子元素的每个子元素

Question

假设我有一个元素，document.createElement("div") ，我们称之为 myDiv myDiv.innerHTML = "<div><p></p></div>" , 现在 myDiv有一个 child :一个div .还有这个div有一个 child ，一个p .我知道我可以得到 myDiv的 child 使用 myDiv.childNodes , 和 div正在使用 myDiv.childNodes[0].childNodes .但是现在我怎样才能得到每个 child 的每个 child ，就像每个存在的 child 一样？示例:

myDiv.innerHTML = "<div><p></p><i></i></div></p></p>"
myDiv.someMethod((childs) => {
   // childs should return the `div`, the `div`'s childs (`p` & `i`) and `p` 
})

Answer 1

你可以使用Element.querySelectorAll

let div = document.createElement('div');
div.innerHTML = `<div><p></p><i></i></div><p></p>`;

console.log([...div.querySelectorAll('*')])