HTML Code

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>setHTMLUnsafe TrustedHTML</title>
  <style>body{font-family:sans-serif;margin:1rem;} #target{padding:0.75rem;border:2px solid #0f766e;border-radius:8px;}</style>
</head>
<body>
  <div id="target">Original</div>
  <pre id="out"></pre>
  <script src="https://cdn.jsdelivr.net/npm/dompurify@3.1.6/dist/purify.min.js"></script>
  <script>
    if (typeof trustedTypes === "undefined") {
      trustedTypes = { createPolicy: function(n, rules) { return rules; } };
    }
    var policy = trustedTypes.createPolicy("demo", {
      createHTML: function(input) { return DOMPurify.sanitize(input); }
    });
    var target = document.getElementById("target");
    var untrusted = 'abc <script>alert(1)<\/script> def';
    if (typeof target.setHTMLUnsafe === "function") {
      var trusted = policy.createHTML(untrusted);
      target.setHTMLUnsafe(trusted);
      document.getElementById("out").textContent = target.innerHTML;
    } else {
      document.getElementById("out").textContent = "setHTMLUnsafe not supported";
    }
  </script>
</body>
</html>

Lines: 0 | Characters: 0

Live Preview Auto-refresh on Run

Element.setHTMLUnsafe — TrustedHTML (Try It)