modo più semplice per rimuovere tutti gli stili in una pagina

Ho bisogno di rimuovere tutte le definizioni di stile in una pagina con javascript, per ottenere lo stesso risultato facendo View > Page Style > No Style in Firefox. Che è il modo più semplice?

InformationsquelleAutor tic | 2012-02-12

 

4 Replies
  1. 19

    È possibile in modo ricorsivo scorrere attraverso tutti gli elementi e rimuovere il style attributo:

    function removeStyles(el) {
        el.removeAttribute('style');
    
        if(el.childNodes.length > 0) {
            for(var child in el.childNodes) {
                /* filter element nodes only */
                if(el.childNodes[child].nodeType == 1)
                    removeStyles(el.childNodes[child]);
            }
        }
    }
    
    removeStyles(document.body);

    Per rimuovere collegati i fogli di stile è possibile, inoltre, utilizzare il seguente frammento:

    var stylesheets = document.getElementsByTagName('link'), i, sheet;
    
    for(i in stylesheets) {
        sheet = stylesheets[i];
    
        if(sheet.getAttribute('type').toLowerCase() == 'text/css')
            sheet.parentNode.removeChild(sheet);
    }
    • Questo consente di rimuovere stili applicati direttamente agli elementi, ma non incide CSS.
    • Grazie per la segnalazione – solo emendata la mia risposta…
    • Il tuo codice mi sembra promettente. Comunque, devo eseguire il secondo frammento di due volte a prendere effetto. Perché? P. S.: .toLowerCase()
    • sì, .toLowerCase() è corretto – il controllo adottate da C# 😛
  2. 10

    Se si dispone di jQuery, probabilmente si può fare qualcosa di simile

    $('link[], style').remove();
    $('*').removeAttr('style');
  3. 4

    Qui è l’ES6 bontà si può fare con una sola linea.

    1) Per rimuovere tutti gli stili inline (ad esempio: style="widh:100px")

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

    2) rimuovere il link al foglio di stile esterno (ad esempio: <link )

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

    3) Per rimuovere tutti di stile in linea di tag (es: <style></style>)

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

    In realtà, document.querySelectorAll restituisce NodeList che ha forEach metodo.

    document.querySelectorAll('link[], style')
      .forEach(elem => elem.parentNode.removeChild(elem));

Lascia un commento