HTML
<h1 data-a11y-text-split
data-split-type="words">
Curious minds leave windows open...
</h1>
<p role="status">Curious mood selected.</p>
Dynamic rebuild
Curious mood selected.
Basic recipe
<h1 data-a11y-text-split
data-split-type="words">
Curious minds leave windows open...
</h1>
<p role="status">Curious mood selected.</p>
import { A11yTextSplit } from
'../dist/index.js';
function setPhrase(text) {
A11yTextSplit.get(title)?.destroy();
title.textContent = text;
new A11yTextSplit(title, { type: 'words' });
}
Destroying the previous instance restores the element, then the new text can be split without leaving stale wrappers behind.