閱讀和更改內聯樣式

內聯樣式

你可以通過簡單地讀取或編輯其 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'。