Может ли DOM быть не деревом

«Может ли DOM быть не деревом» — вопрос из категории HTML, который задают на 10% собеседований Frontend Разработчик. Ниже — развёрнутый ответ с разбором ключевых моментов.

Ответ

DOM всегда является деревом, так как это иерархическая структура, где каждый узел имеет только одного родителя (кроме корневого). Однако, есть исключения:

  1. Фрагменты документа (DocumentFragment) — временные деревья, не являющиеся частью основного DOM.
  2. Тени DOM (Shadow DOM) — изолированные поддеревья, которые не видны в основном DOM, но всё равно остаются деревьями внутри своей области.

Пример Shadow DOM:

<div id="host"></div>
<script>
  const host = document.getElementById('host');
  const shadowRoot = host.attachShadow({ mode: 'open' });
  shadowRoot.innerHTML = '<p>Shadow DOM content</p>';
</script>

Таким образом, DOM всегда остаётся деревом, но может содержать изолированные поддеревья.