/*! CSS Naked Day script v2.0 | The MIT License (MIT) Copyright (c) 2015 Ben Buchanan http://opensource.org/licenses/MIT *//*Removes all linked, alternate, embedded and inline styles on April 9th (unless set to ignored). Works in IE11 and evergreen browsers.Changes: 2020.08.23 v2.0 - Updated to catch alternate stylesheets & added ignore feature.*/(function(){vartoday=newDate(),month=today.getMonth(),day=today.getDate(),elements,attrs;// For testing:// month = 3; day = 9;if(document.querySelectorAll&&month===3&&day===9){// Add data-cssnakedday="ignore" to any element you want this script to ignore/not remove.// Useful if you have CSS supporting functionality that should still work during naked day.functionnotIgnored(el){return(el.getAttribute('data-cssnakedday')!="ignore")}// Remove all linked stylesheets and style blockselements=document.querySelectorAll('link[rel~="stylesheet"], style');for(vari=0;i<elements.length;i++){if(notIgnored(elements[i])){elements[i].parentNode.removeChild(elements[i]);}}// Remove all inline stylesattrs=document.querySelectorAll('[style]');for(varii=0;ii<attrs.length;ii++){if(notIgnored(attrs[ii])){attrs[ii].removeAttribute('style');}}// Inject a message at the top of the document. Optional - just remove this section if you don't want it.varmessage=document.createElement('div');varbody=document.getElementsByTagName('body')[0];message.innerHTML='<p>Why is this page looking so simple? It\'s <a href="https://css-naked-day.github.io">CSS Naked Day</a>!</p><hr>';body.insertBefore(message,body.firstChild);}})();
Comments (5)
Ben Buchanan
Update - changed to link to the github.io site instead of google group.
Neville Stokes
Might link[rel="stylesheet"] give a more appropriate list of elements to remove, rather than removing all link elements?
Ben Buchanan
Yeah that’s a good idea. Will update it.
Dan Q
Might link[rel~="stylesheet"] be even better? That will also match e.g. <link rel="alternate stylesheet" ...> (alternate stylesheets could be in use by a given user-agent) and any other/future secondary rel values that include stylesheets.
Ben Buchanan
Good idea. Have updated the script to use that selector; and I’ve added an ignore feature while I was looking at it.
HTTPSSSH
You can clone a snippet to your computer for local editing.
Learn more.
Update - changed to link to the github.io site instead of google group.
Might
link[rel="stylesheet"]
give a more appropriate list of elements to remove, rather than removing alllink
elements?Yeah that’s a good idea. Will update it.
Might
link[rel~="stylesheet"]
be even better? That will also match e.g.<link rel="alternate stylesheet" ...>
(alternate stylesheets could be in use by a given user-agent) and any other/future secondaryrel
values that include stylesheets.Good idea. Have updated the script to use that selector; and I’ve added an ignore feature while I was looking at it.