How do I use Javascript to remove all CSS styles in a HTML doc?

Question

Here is what I have so far

loop(document);

function loop(node){

    // do something with the node here

    var nodes = node.childNodes;

    for (var i = 0; i < nodes.length; i++){

        if(!nodes[i]){
            continue;
        }

        if(nodes[i].childNodes.length > 0){


        let elements = loop(nodes[i]);

        // remove attributes
        elements.removeAttribute('');

        }

    }

}

But I keep on getting an error after the elements.removeAttribute, why??? What am I doing wrong?

Answer 1 · 2018-03-13T14:13:49Z

March 13, 2018 2:13pm

The "elements" variable is being set to the result of a recursive call to "loop", but "loop" doesn't return anything, so "elements" will always be undefined. Applying the "removeAttribute" method to an undefined variable produces the error.

There are several other issues here as well, including:

"removeAttribute" only removes the attribute named by the argument, passing a blank will do nothing
"removeAttribute" works on elements, but not all nodes are elements
removing all attributes will have serious side effects (such as links not working)

And not all CSS relies on attributes, so even if this worked, the CSS that doesn't involve "style" or "class" attributes would not be affected.

It would be more effective, and avoid side-effects, to simply remove the lines that load CSS from the HTML.

Welcome to the Treehouse Community

Looking to learn something new?

Greg Schudel

Greg Schudel

How do I use Javascript to remove all CSS styles in a HTML doc?

1 Answer

Steven Parker

Steven Parker