Получить каждый дочерний элемент каждого дочернего элемента в JavaScript

Question

Допустим, у меня есть элемент document.createElement("div"), мы назовем его myDiv myDiv.innerHTML = "<div><p></p></div>", теперь у myDiv есть дочерний элемент: div. И у этого div есть ребенок, p. Я знаю, что могу получить myDiv childs, используя myDiv.childNodes, а div, используя myDiv.childNodes[0].childNodes. Но теперь, как я могу получить каждого ребенка каждого ребенка, как и каждого ребенка, который существует? Пример:

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('*')])