如何使用javascript清除所有内联样式,并只保留CSS样式表中指定的样式?
如果我在我的HTML如下:如何使用javascript清除所有内联样式,并只保留CSS样式表中指定的样式?
<div style="height:300px; width:300px; background-color:#ffffff;"></div>
这在我的CSS样式表:
div {
width:100px;
height:100px;
background-color:#000000;
}
有什么办法,使用javascript/jQuery的,除去所有的内嵌样式并只留下CSS样式表指定的样式?
$('div').attr('style', '');
或
$('div').removeAttr('style');
(从Andres's Answer)
要小这一点,试试这个:
$('div[style]').removeAttr('style');
这应该加快步伐一点,因为它会检查div是否具有style属性。
无论哪种方式,如果您有大量的div,这可能需要一些时间来处理,因此您可能需要考虑除javascript之外的其他方法。
$('div').removeAttr('style');
您也可以尝试上市样式表的CSS!重要
我用的是$('div').attr('style', '');
技术,它是不是在IE8工作。
我使用alert()
输出了style属性,并且没有去掉内联样式。
.removeAttr
最终在IE8中诀窍。
普通的JavaScript:
你不需要jQuery的做一些琐碎的这个样子。只需使用.removeAttribute()
方法。
假设你只是针对单个元件,可以很容易地使用下面的:(example)
document.querySelector('#target').removeAttribute('style');
如果通过元件的选定集合靶向多种元素,只是循环:(example)
var target = document.querySelectorAll('div');
Array.prototype.forEach.call(target, function(element){
element.removeAttribute('style');
});
Array.prototype.forEach()
-IE9及以上/ .querySelectorAll()
-IE 8(部分)IE9及以上。
1:选择您想以任何标记名要更改的元素,ID,类等
这可以分两步来完成
var element = document.getElementsByTagName('h2')[0];
- 除去风格属性
element.removeAttribute('style');
如果需要只是空的,则一个元素的style
:element.style.cssText = null;
这应该做得很好。希望能帮助到你!
如果它必须删除样式属性,它也将不得不寻找它,所以最后的解决方案似乎只是使代码变得更加imho。当然,最好的办法是只选择你需要删除样式的元素,通过ID可能。 – 2011-08-03 13:15:56
这将只针对divs。如果你想瞄准一切呢? – streetlight 2013-05-17 19:23:10
作为一个相关函数,调用带有空字符串的`.css()`作为第二个值将只从内联样式中移除指定的值,例如$('div')。css('display','');将只删除内联显示属性(如果设置)。 – 2013-09-27 14:32:01