删除内联样式

此功能还保留隐藏的内容。

function remove_style(all) {
  var i = all.length;
  var j, is_hidden;

  // Presentational attributes.
  var attr = [
    'align',
    'background',
    'bgcolor',
    'border',
    'cellpadding',
    'cellspacing',
    'color',
    'face',
    'height',
    'hspace',
    'marginheight',
    'marginwidth',
    'noshade',
    'nowrap',
    'valign',
    'vspace',
    'width',
    'vlink',
    'alink',
    'text',
    'link',
    'frame',
    'frameborder',
    'clear',
    'scrolling',
    'style'
  ];

  var attr_len = attr.length;

  while (i--) {
    is_hidden = (all[i].style.display === 'none');

    j = attr_len;

    while (j--) {
      all[i].removeAttribute(attr[j]);
    }

    // Re-hide display:none elements,
    // so they can be toggled via JS.
    if (is_hidden) {
      all[i].style.display = 'none';
      is_hidden = false;
    }
  }
}

用法

像这样调用函数:

var all = document.getElementsByTagName('*');
remove_style(all);

注意:通过通配符查询选择页面中的所有元素可能很慢,具体取决于页面中有多少个元素。 您可以使用较小的元素集来提高性能:

var set = document.getElementById('foo').getElementsByTagName('bar');
remove_style(set);

内森·史密斯(Nathan Smith)编写的代码。

翻译自: https://css-tricks.com/snippets/javascript/remove-inline-styles/

你可能感兴趣的:(删除内联样式)