TypeScript или JS- Как выбрать элемент и все его дочерние элементы в HTMLCollection?

Question

Обновлен код, который я придумал:

<section id="Test">
   <header>Welcome</header>
   <p>This is a test</p>
   <div>Nothing here</div>
</section>

var element =  document.getElementById("Test");
var elements = <HTMLCollection>element.getElementsByTagName("*");

Я хочу, чтобы коллекция включала <section>, <header>, <p>, а также <div> приведенный выше код имеет только <header>, <p>, а также <div>, В любом случае я могу добавить <section> себя в коллекцию?

Проблема в том, что я хочу включить сам элемент в коллекцию элементов. Я знаю, что могу использовать externalHTML и поместить его в временный контейнер, а затем получить из него весь элемент, но я ищу более чистый путь.

Answer 1

Вы можете использовать список через запятую с querySelectorAll где первым элементом является сам элемент.

Этот фрагмент использует ваш HTML для получения раздела Test и его дети: header, p, а также div:

var elements= document.querySelectorAll('#Test, #Test *');
console.log(elements.length); //4

<section id="Test">
   <header>Welcome</header>
   <p>This is a test</p>
   <div>Nothing here</div>
</section>