DevCurry: Remove All Stylesheets from a Page using jQuery

Here’s a very simple piece of code that removes all stylesheet links from a Page using jQuery

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Remove All Stylesheets From a Page</title>
    <link href="CSS/RoundCorners.css" rel="stylesheet" type="text/css" />
    <link href="CSS/FloatDes.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript"
    src="http://ajax.microsoft.com/ajax/jQuery/jquery-1.4.2.min.js">
    </script>
    <script type="text/javascript">
        $(function() {
            $("#removeAll").click(function() {
                $('link[rel=stylesheet]').remove();
            });
        });
    </script>
</head>
<body>
    <div class="sub-level"></div>
    <br />
    <input id="removeAll" type="button" value="Remove All Stylesheets" />
</body>
</html>

Originally the page with the stylesheets applied looked similar to the following:

and after the Button is clicked and the stylesheets removed, the page looks like this

Remove All Stylesheets from a Page using jQuery

2 comments: