HTML DOM 允許 JavaScript 更改 HTML 元素的樣式。 改變 HTML 樣式 如需更改 HTML 元素的樣式,請使用此語法: document.getElementById(id).style.property = new style 下麵的例子更改了 <p> 元素的樣式: 實例 ...
HTML DOM 允許 JavaScript 更改 HTML 元素的樣式。
改變 HTML 樣式
如需更改 HTML 元素的樣式,請使用此語法:
document.getElementById(id).style.property = new style
下麵的例子更改了 <p> 元素的樣式:
實例
<html> <body> <p id="p2">Hello World!</p> <script> document.getElementById("p2").style.color = "blue"; </script> <p>上面的段落已被腳本改變。</p> </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>