Главная мысль
DOM (Document Object Model) — объектное представление HTML-документа в памяти браузера: дерево узлов (элементы, текст, комментарии).
Зачем
JS читает и меняет страницу через DOM API:
document.querySelector("h1").textContent = "Привет";
HTML — текст файла; DOM — живая структура после парсинга (и после правок скриптами).
Важно
Частые тяжёлые правки DOM дорого обходятся layout/paint — отсюда виртуальный DOM во фреймворках и батчинг обновлений.
Итог: DOM — дерево страницы, которым управляет JS; это не «сам HTML-файл», а его модель в браузере.