simplest way to remove all the styles in a page

Question

I need to remove all the style definitions in a page using javascript, to obtain the same result as doing View > Page Style > No Style in Firefox. Which is the simplest way?

Answer 1

Here is the ES6 goodness you can do with just one line.

1) To remove all inline styles (eg: style="widh:100px")

document.querySelectorAll('[style]')
  .forEach(el => el.removeAttribute('style'));

2) To remove link external stylesheet (eg: <link rel="stylesheet")

document.querySelectorAll('link[rel="stylesheet"]')
  .forEach(el => el.parentNode.removeChild(el));

3) To remove all inline style tags (eg: <style></style>)

document.querySelectorAll('style')
  .forEach(el => el.parentNode.removeChild(el));