Remove inline styles and add in the site header
Want to display a clean code and without inline content?
Here's a fun way to remove the codes online and add all the site so header within the style
tag, of course.
(function () {
/*
*
* Variable definitions
*
* @variables
* a = Array (exit repeat loop)
* c = Count (for new classes count)
* e = Space (if there is already a class, add space)
* h = Header (create a style based on the header "head")
* n = New style (insert new style to the style base)
* r = Random (creates a new class / id random)
* s = Selectors (search all style selectors)
* t = Inline text (inline text captures the style)
*
*/
var c, e, h, n, r, s, t;
r = Math.random().toString(36).substring(14);
s = document.querySelectorAll("*[style]");
h = document.createElement('style');
h.id = r;
document.getElementsByTagName('head')[0].appendChild(h);
c = 1;
Array.prototype.forEach.call(s, function (a) {
e = '';
if (a.className !== '') {
e = ' ';
}
a.className = a.className + e + r + '_' + c;
t = a.style.cssText;
n = document.getElementById(r);
n.innerHTML = n.innerHTML + '.' + r + '_' + c + '{' + t + '}';
a.style.cssText = '';
c = c + 1;
});
})();
Great! To view the operating, add this script in the header of your site and just let it work.
Written by Willian Keller
Related protips
Have a fresh tip? Share with Coderwall community!
Post
Post a tip
Best
#Javascript
Authors
Sponsored by #native_company# — Learn More
#native_title#
#native_desc#