with style attributes
const clean = DOMPurify.sanitize(dirty, {ALLOWED_TAGS: ['b', 'q'], ALLOWED_ATTR: ['style']});
// allow all safe HTML elements but neither SVG nor MathML
// note that the USE_PROFILES setting will override the ALLOWED_TAGS setting
// so don't use them together
const clean = DOMPurify.sanitize(dirty, {USE_PROFILES: {html: true}});
// allow all safe SVG elements and SVG Filters, no HTML or MathML
const clean = DOMPurify.sanitize(dirty, {USE_PROFILES: {svg: true, svgFilters: true}});
// allow all safe MathML elements and SVG, but no SVG Filters
const clean = DOMPurify.sanitize(dirty, {USE_PROFILES: {mathMl: true, svg: true}});
// change the default namespace from HTML to something different
const clean = DOMPurify.sanitize(dirty, {NAMESPACE: 'http://www.w3.org/2000/svg'});
// leave all safe HTML as it is and add
123456
goodbyenot me!
`;
// Specify a configuration directive
const config = {
ALLOWED_TAGS: ['p', '#text'], // only and text nodes
KEEP_CONTENT: false, // remove content from non-allow-listed nodes too
ADD_ATTR: ['kitty-litter'], // permit kitty-litter attributes
ADD_TAGS: ['ying', 'yang'], // permit additional custom tags
RETURN_DOM: true // return a document object instead of a string
};
// Clean HTML string and write into our DIV
const clean = DOMPurify.sanitize(dirty, config);
// Grab innerHTML from returned clean body node
document.getElementById('sanitized').innerHTML = clean.innerHTML;