HTML DOM - Pengubahsuaian



Ubah suai HTML = tukar elemen, atribut, gaya dan acara.


Mengubah suai elemen HTML

Mengubah suai HTML DOM bermakna banyak perkara yang berbeza:

  • Menukar kandungan HTML

  • Tukar gaya CSS

  • Tukar atribut HTML

  • Buat elemen HTML baharu

  • Padamkan elemen HTML sedia ada

  • Tukar acara (pengendali)

Dalam bab seterusnya, kita akan mengetahui lebih lanjut tentang mengubah suai kaedah Biasa HTML DOM.


Membuat kandungan HTML

Cara paling mudah untuk menukar kandungan elemen ialah menggunakan sifat innerHTML.

Contoh berikut mengubah kandungan HTML elemen <p> »

Klik butang "Jalankan Contoh" untuk melihat contoh dalam talian


Tukar gaya HTML

Melalui HTML DOM , anda boleh mengakses objek gaya elemen HTML.

Contoh berikut menukar gaya HTML perenggan:
lamp我们将在下面的章节为您解释例子中的细节。


Contoh

<html><!DOCTYPE html>
<html>
<body>

<p id="p1">Hello World!</p>

<script>
document.getElementById("p1").innerHTML="New text!";
</script>

<p>The paragraph above was changed by a script.</p>

</body>
</html>

Jalankan contoh»

Klik butang "Jalankan Contoh" untuk melihat contoh dalam talian

Buat elemen HTML baharu
Untuk menambah elemen baharu pada DOM HTML, anda mesti mula-mula buat elemen (nod elemen) dan kemudian tambahkannya pada elemen sedia ada.

Instance

<html><!DOCTYPE html>
<html>
<body>

<p id="p1">Hello world!</p>
<p id="p2">Hello world!</p>

<script>
document.getElementById("p2").style.color="blue";
document.getElementById("p2").style.fontFamily="Arial";
document.getElementById("p2").style.fontSize="larger";
</script>

</body>
</html>

Run Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian