JavaScript DOM CSS
-
更改HTML样式
HTML DOM允许JavaScript更改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>The paragraph above was changed by a script.</p> </body> </html>
-
使用事件
HTML DOM允许您在事件发生时执行代码。当HTML元素发生“事情”时,浏览器会生成事件:当用户单击按钮时,此示例更改id="id1"元素的样式:
尝试一下<!DOCTYPE html> <html> <body> <h1 id="id1">My Heading 1</h1> <button type="button" onclick="document.getElementById('id1').style.color = 'red'"> 点击我!</button> </body> </html>