HTML DOM 改變 CSS

2022-02-10 14:51 更新

HTML DOM 允許 JavaScript 改變 HTML 元素的樣式。

改變 HTML 樣式

如需改變 HTML 元素的樣式，請(qǐng)使用這個(gè)語法：

document.getElementById(id).style.property=new style

下面的例子會(huì)改變 <p> 元素的樣式：

實(shí)例

<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>

嘗試一下 ?

本例改變了 id="id1" 的 HTML 元素的樣式，當(dāng)用戶點(diǎn)擊按鈕時(shí)：

實(shí)例

<!DOCTYPE html>
<html>
<body>

<h1 id="id1">My Heading 1</h1>
<button type="button"
onclick="document.getElementById('id1').style.color='red'">
Click Me!</button>

</body>
</html>

嘗試一下 ?

更多實(shí)例

Visibility
如何使元素不可見。您希望元素顯示或消失嗎？

參考文章

JavaScript 和 HTML 參考手冊(cè)：Style 對(duì)象


以上內(nèi)容是否對(duì)您有幫助：
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)