No Login Data Private Local Save

HTML Sanitizer - Online Clean Dangerous Tags & XSS Prevention

34
0
0
0
✓ Copied to clipboard!

HTML Sanitizer & XSS Prevention

Clean dangerous tags, strip malicious attributes, and prevent cross-site scripting attacks instantly.

Client-Side Safe
Input HTML Paste your code here
Quick Examples: XSS Script Event Handlers Malicious Link Mixed Content
Sanitized Output 
Waiting for input...
Your data never leaves your browser

Frequently Asked Questions

HTML sanitization is the process of cleaning HTML code by removing or neutralizing potentially dangerous elements. It's essential for preventing Cross-Site Scripting (XSS) attacks, which occur when malicious scripts are injected into web pages viewed by other users. Without sanitization, attackers can steal cookies, hijack sessions, redirect users to phishing sites, or deface websites. A robust sanitizer strips tags like <script>, <iframe>, <object>, and removes event handler attributes such as onclick, onerror, and onload. It also blocks javascript: protocol URLs in links and images.

High-risk tags that are typically removed include: <script>, <iframe>, <object>, <embed>, <applet>, <form>, <input>, <button>, <select>, <textarea>, <link>, <base>, and <meta>.

Dangerous attributes include all event handlers: onclick, onerror, onload, onmouseover, onfocus, onblur, onchange, onsubmit, onkeydown, onkeyup, and over 100+ more on* attributes. The javascript: protocol in href and src attributes is also stripped. In strict mode, style attributes may also be removed to prevent CSS-based injection vectors.

Balanced Mode (recommended for most use cases) removes all dangerous tags and event handlers while preserving safe, semantic HTML tags like <a> (with safe href), <img> (with safe src), <table>, <ul>, <ol>, <h1>-<h6>, <p>, <strong>, <em>, <blockquote>, <code>, <pre>, and many more. Style attributes are preserved but checked for dangerous content.

Strict Mode goes further by removing all style attributes, stripping class and id attributes, and only allowing the most basic formatting tags like <b>, <i>, <u>, <p>, <br>, <strong>, <em>, <ul>, <ol>, and <li>. This is ideal for comment systems or fields requiring maximum security.

Client-side sanitization is an excellent first line of defense, but it should never be your only protection. A security best practice called "defense in depth" recommends sanitizing both on the client side (for immediate user feedback and to protect against DOM-based XSS) and on the server side (to protect against attackers who bypass client-side validation). Server-side libraries like DOMPurify (Node.js), OWASP AntiSamy (Java), or Bleach (Python) provide robust, battle-tested sanitization. Always sanitize data before storing it in a database and before rendering it in a browser.

This tool uses the browser's built-in DOMParser API to parse raw HTML into a structured DOM tree. It then recursively traverses every element node, checking each tag against a whitelist of safe tags and each attribute against a blacklist of dangerous patterns (event handlers, javascript: protocols). Dangerous elements are removed while preserving their text content. The sanitized DOM is then serialized back to clean HTML using innerHTML. All processing happens entirely in your browser — no data is ever sent to any server, ensuring your HTML remains private and secure.

Common XSS vectors include:
• Stored XSS: Malicious scripts are permanently stored on the target server (e.g., in a comment field or user profile) and served to other users.
• Reflected XSS: Malicious scripts are reflected off a web server via search results, error messages, or URL parameters.
• DOM-based XSS: The attack payload is executed by modifying the DOM environment in the victim's browser.
• Mutation XSS (mXSS): Exploits differences between how browsers parse HTML and how sanitizers process it.

Attackers often use obfuscation techniques like HTML entity encoding, mixed case tags, null bytes, or nested elements to bypass naive filters. This tool handles these edge cases by parsing the HTML properly before sanitization.

This tool provides two pre-configured sanitization profiles (Balanced and Strict) that cover the vast majority of use cases. For advanced users who need custom tag whitelists, consider using libraries like DOMPurify which offer extensive configuration options. You can specify allowed tags, allowed attributes, and even custom hooks for fine-grained control. If you're implementing sanitization in your own application, DOMPurify's ALLOWED_TAGS and ALLOWED_ATTR configurations give you full flexibility to define your own security policy.
Security Best Practice

Always combine client-side sanitization with server-side validation. Use Content Security Policy (CSP) headers to restrict which scripts can execute on your site. Set cookies with HttpOnly and Secure flags. Remember: never trust user input — sanitize early, sanitize often.

\n

This is safe content.

\n\n
Welcome to our site!
', 'event-handlers': '
\n Hover or click me - but the handlers will be removed!\n
\n\n

Event handlers are dangerous.

', 'malicious-link': 'Click me - looks safe but isn\'t!\nThis is a real safe link\n\n', 'mixed-content': '

User Profile

\n

Hello World!

\n\n\nProfile photo\n\n

End of profile.

' }; // ────────────────────────────────────── // Event Handlers // ────────────────────────────────────── $btnSanitize.on('click', function() { const $btn = $(this); $btn.addClass('disabled').prop('disabled', true); $btn.find('i').removeClass('fa-shield').addClass('fa-spinner fa-spin'); // Small delay for UX feedback setTimeout(() => { performSanitization(); $btn.removeClass('disabled').prop('disabled', false); $btn.find('i').removeClass('fa-spinner fa-spin').addClass('fa-shield'); }, 150); }); $btnClear.on('click', function() { $input.val(''); $outputCode.html('Waiting for input...'); $outputPreview.html('').addClass('d-none'); $outputCode.removeClass('d-none'); $viewCodeRadio.prop('checked', true); $statsRow.fadeOut(200); sanitizeStats = { originalSize: 0, cleanedSize: 0, tagsRemoved: 0, attrsStripped: 0, dangerousTagsFound: [] }; }); $btnCopy.on('click', copyOutput); $viewCodeRadio.on('change', toggleView); $viewPreviewRadio.on('change', toggleView); // Example chips $('.example-chips .chip').on('click', function() { const exampleKey = $(this).data('example'); if (examples[exampleKey]) { $input.val(examples[exampleKey]); // Auto-sanitize on example selection $btnSanitize.trigger('click'); } }); // Keyboard shortcut: Ctrl+Enter to sanitize $input.on('keydown', function(e) { if ((e.ctrlKey || e.metaKey) && e.key === 'Enter') { e.preventDefault(); $btnSanitize.trigger('click'); } }); // Mode switch auto re-sanitize $modeBalanced.on('change', function() { if ($(this).is(':checked') && $input.val().trim()) { $btnSanitize.trigger('click'); } }); $modeStrict.on('change', function() { if ($(this).is(':checked') && $input.val().trim()) { $btnSanitize.trigger('click'); } }); // ────────────────────────────────────── // Initial State // ────────────────────────────────────── $statsRow.hide(); $outputPreview.addClass('d-none'); // Load a default example for immediate demonstration const defaultExample = '

Hello World!

\n\n
\n Click me - the onclick will be stripped!\n
\nDangerous link\nSafe link\nPhoto'; $input.val(defaultExample); // Auto-run sanitization on page load setTimeout(() => { performSanitization(); }, 100); })();
🔧 Related Tools