阅读和更改内联样式
内联样式
你可以通过简单地读取或编辑其 style
属性来操作 HTML 元素的内联 CSS 样式。
假设以下元素:
<div id="element_id" style="color:blue;width:200px;">abc</div>
应用此 JavaScript:
var element = document.getElementById('element_id');
// read the color
console.log(element.style.color); // blue
//Set the color to red
element.style.color = 'red';
//To remove a property, set it to null
element.style.width = null;
element.style.height = null;
但是,如果 width: 200px;
设置在外部 CSS 样式表中,则 element.style.width = null
将无效。在这种情况下,要重置样式,你必须将其设置为 initial
:element.style.width = 'initial'
。