Jambo JavaScript HTML DOM - Kuhifadhi CSS

HTML DOM 允许 JavaScript 更改 HTML 元素的样式。

改变 HTML 样式

如需更改 HTML 元素的样式，请使用此语法：

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

下面的例子更改了 <p> 元素的样式：

Mfano

<html>
<body>
<p id="p2">Hello World!</p>
<script>
document.getElementById("p2").style.color = "blue";
</script>
<p>Makala ya juu imebadilishwa na skripta.</p>
</body>
</html>

Jifunze kwa urahisi

Matukio

HTML DOM inaruhusiisha inayofanywa kwa sababu ya kutokea matukio.

Kama 'mashauri' yanaendelea kwenye maele wa HTML, kifungu kilichotengenezwa kwa sababu ya kutokea matukio kwenye kifungu hiki:

  • Kama maele inafikia
  • Kama ukagombaa ueneza
  • Kama ingia inachangwa

Wewe utakaribia kuelewa zaidi kuhusu matukio katika kitabu hiki cha mbele.

Mfano huu utakaribia kumwambia kwamba maele wa id="id1" inachangea muundo yake kwa sababu ya kubainishwa kwa maele yote:

Mfano

<!DOCTYPE html>
<html>
<body>
<h1 id="id1">Makala ya mbele 1</h1>
<button type="button" onclick="document.getElementById('id1').style.color = 'red'">
Tukikwa!
</button>
</body>
</html>

Jifunze kwa urahisi

Mfano mengi

Uonekana
Maele yanaonekana bila ya. Na unaonesha maele?

Kifaa cha Taarifa cha Muundo wa HTML DOM

Kwa sababu ya kumtaarifu kila muundo wa HTML DOM, tafadhali tazama Kifaa cha Taarifa cha Muundo wa HTML DOM.