JavaScript HTML DOM - 更改 CSS
HTML DOM 允許 JavaScript 更改 HTML 元素的樣式。
更改 HTML 樣式
要更改 HTML 元素的樣式，請使用以下語法：
document.getElementById(id).style.屬性 = 新樣式
以下示例更改 <p> 元素的樣式：
示例
<html>
<body>
<p id="p2">Hello World!</p>
<script>
document.getElementById("p2").style.color = "blue";
</script>
</body>
</html>
自己動手試一試 »
使用事件
HTML DOM 允許您在事件發生時執行程式碼。
當 HTML 元素“發生事情”時，瀏覽器會生成事件。
- 點選了一個元素
- 頁面已載入
- 輸入欄位已更改
您將在本教程的下一章中瞭解更多關於事件的資訊。
此示例在使用者點選按鈕時更改具有 id="id1" 的 HTML 元素的樣式：
示例
<!DOCTYPE html>
<html>
<body>
<h1 id="id1">我的標題 1</h1>
<button type="button"
onclick="document.getElementById('id1').style.color = 'red'">
點選我！</button>
</body>
</html>
自己動手試一試 »
更多示例
可見性 如何使元素不可見。您想顯示該元素還是不顯示？
HTML DOM 樣式物件參考
有關所有 HTML DOM 樣式屬性，請查閱我們完整的HTML DOM 樣式物件參考。
