为了避免DOM更改被合并在一起，可以使用DocumentFragment（文档片段）。文档片段是一种轻量级的文档对象，它的主要作用是跟踪一组节点以便在文档树中的某个位置插入它们，这样可以避免频繁地导致页面重排。以下是一个使用文档片段的示例：

// 创建文档片段
const fragment = document.createDocumentFragment();

// 创建多个DOM节点并添加到文档片段中
const node1 = document.createElement('div');
node1.textContent = 'node1';
fragment.appendChild(node1);

const node2 = document.createElement('div');
node2.textContent = 'node2';
fragment.appendChild(node2);

const node3 = document.createElement('div');
node3.textContent = 'node3';
fragment.appendChild(node3);

// 将文档片段添加到页面中指定的位置
const parent = document.getElementById('parent');
parent.appendChild(fragment);

在上面的代码中，我们创建一个文档片段，然后在其中创建了三个div节点，然后将文档片段作为一个整体添加到页面指定位置。这样做会触发一次DOM更改，而不是三次，因此可以提高页面性能。