Disable All CSS on a Page with JavaScript

Let’s say you want to verify the order in which the content is displayed, or you want to test the accessibility of a page when styles are disabled.

We can do that by running a single line of JavaScript.

Let’s get started!

Remove CSS on a Page

Go to a page for which you want to disable the styles and open the browser console (F12).

Before running the code I just want to let you know that pasting JavaScript code into the browser console can pose security risks.

The code could steal sensitive information and exploit vulnerabilities. Do not paste JavaScript code from untrusted sources.

Now that I’ve made that clear, you can run the following code:

document.querySelectorAll('style, link[rel="stylesheet"]').forEach(e => e.remove());

The code finds all the <style> and <link rel="stylesheet"> elements on the page and removes them.

This is what the Neutron Dev YouTube page looks like without CSS:

🎥 Full video walkthrough:

Comments