Clear Local Storage

The Clear Local Storage bookmarklet is a powerful tool for web developers to quickly clear all local storage data for the current domain. This tool is particularly useful for testing, debugging, and ensuring a clean state for development.

javascript:!function(){const n=document.createElement("div");n.style.cssText="\n        position: fixed;\n        top: 50%;\n        left: 50%;\n        transform: translate(-50%, -50%);\n        background: white;\n        padding: 20px;\n        border-radius: 8px;\n        box-shadow: 0 2px 10px rgba(0,0,0,0.1);\n        z-index: 10000;\n        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;\n        min-width: 300px;\n    ";const e=window.location.hostname,t=localStorage.length;n.innerHTML=`\n        <div style="margin-bottom: 15px; display: flex; justify-content: space-between; align-items: center;">\n            <h3 style="margin: 0;">Clear Local Storage</h3>\n            <button onclick="this.parentElement.parentElement.remove()" \n                    style="background: none; border: none; font-size: 20px; cursor: pointer;">×</button>\n        </div>\n        <div style="margin-bottom: 15px;">\n            <p style="margin: 0 0 10px 0;">Domain: <strong>${e}</strong></p>\n            <p style="margin: 0;">Items to clear: <strong>${t}</strong></p>\n        </div>\n        <div style="margin-bottom: 15px;">\n            <button onclick="window.clearStorage()" \n                    style="width: 100%; padding: 10px; background: #dc3545; color: white; border: none; border-radius: 4px; cursor: pointer;">\n                Clear All Local Storage Data\n            </button>\n        </div>\n        <div style="font-size: 12px; color: #666;">\n            Warning: This action cannot be undone. All local storage data for this domain will be permanently deleted.\n        </div>\n    `,window.clearStorage=function(){try{localStorage.clear(),n.innerHTML=`\n                <div style="margin-bottom: 15px; display: flex; justify-content: space-between; align-items: center;">\n                    <h3 style="margin: 0;">Local Storage Cleared</h3>\n                    <button onclick="this.parentElement.parentElement.remove()" \n                            style="background: none; border: none; font-size: 20px; cursor: pointer;">×</button>\n                </div>\n                <div style="margin-bottom: 15px;">\n                    <p style="margin: 0;">All local storage data for <strong>${e}</strong> has been cleared successfully.</p>\n                </div>\n                <div style="font-size: 12px; color: #666;">\n                    You can now close this popup.\n                </div>\n            `}catch(e){n.innerHTML=`\n                <div style="margin-bottom: 15px; display: flex; justify-content: space-between; align-items: center;">\n                    <h3 style="margin: 0;">Error</h3>\n                    <button onclick="this.parentElement.parentElement.remove()" \n                            style="background: none; border: none; font-size: 20px; cursor: pointer;">×</button>\n                </div>\n                <div style="margin-bottom: 15px;">\n                    <p style="margin: 0; color: #dc3545;">Failed to clear local storage:</p>\n                    <p style="margin: 5px 0 0 0; font-size: 12px;">${e.message}</p>\n                </div>\n            `}},document.body.appendChild(n)}();

• Clears all local storage data for the current domain
• Shows number of items to be cleared
• Displays current domain information
• Provides clear success/error feedback
• Simple to use with a single click

Why Use Clear Local Storage? #

The Clear Local Storage bookmarklet is essential for developers who need to:

• Reset application state during testing
• Clear cached data for debugging
• Ensure a clean development environment
• Test application behavior with fresh storage
• Remove outdated or corrupted storage data

Features #

1. Domain-Specific Clearing

   • Only affects the current domain
   • Preserves data for other domains
   • Shows domain information

2. Safety Measures

   • Displays warning message
   • Shows number of items to be cleared
   • Requires explicit confirmation

3. Clear Feedback

   • Success confirmation message
   • Error handling and display
   • Easy to close popup

4. User-Friendly Interface

   • Clean, modern design
   • Clear instructions
   • Intuitive controls

How to Use #

1. Click the bookmarklet to activate the tool
2. Review the domain and number of items to be cleared
3. Click the "Clear All Local Storage Data" button
4. Confirm the action
5. View the success/error message
6. Close the popup when done

Best Practices #

• Use this tool only when necessary
• Back up important data before clearing
• Test in development environment first
• Document storage structure before clearing
• Verify application behavior after clearing

• Previous: Check XML Sitemap
• Next: Clear Session Storage