JA @projavascript
Text, Range и точечной модификации DOM содержимое элемента может оказаться фрагментировано на несколько соседних текстовых узлов.const container = document.createElement('div');
const text = document.createTextNode('Hello');
container.append(text);
const tail = text.splitText(2);
console.log([...container.childNodes].map(node => node.data));
// ['He', 'llo']console.log(container.textContent);
// Hello
childNodes, firstChild, nextSibling или хранит ссылки на конкретные Text-узлы, такая фрагментация уже существенна.Node.normalize() приводит всё поддерево узла к нормализованной форме:container.normalize();
console.log(container.childNodes.length);
// 1
console.log(container.firstChild.data);
// Hello
Text-узлов добавляются к первому узлу группы, а сами последующие узлы удаляются из дерева.console.log(tail.parentNode);
// null
tail при этом не становится невалидной: объект продолжает существовать, но больше не является частью DOM-дерева.normalize() не объединяет весь текст элемента в один узел, если между текстовыми узлами находятся другие узлы.<p>Hello <strong>DOM</strong>!</p>
<strong> останется в разных Text-узлах и после нормализации.splitText(), операций с Range и редакторских сценариев, где текстовые узлы регулярно разрезаются и склеиваются:const paragraph = document.createElement('p');
const text = document.createTextNode('Hello world');
paragraph.replaceChildren(text);
text.splitText(5);
console.log(paragraph.childNodes.length);
// 2
paragraph.normalize();
console.log(paragraph.childNodes.length);
// 1Node.normalize() не меняет текстовое содержимое элемента, но приводит его поддерево к нормализованной форме: без пустых и соседних текстовых узлов. Это полезно перед обходом DOM, сериализацией, сравнением структуры или выполнением алгоритмов, которые рассчитывают на предсказуемую организацию Text-узлов.
