JavaScript - Model Objek Dokumen (DOM)

<p> dom Penjelasan terperinci: Antara muka pengaturcaraan dokumen web

<p> DOM (Model Objek Dokumen) adalah antara muka pengaturcaraan untuk dokumen web. Dengan bantuan DOM, pemaju boleh menggunakan JavaScript untuk berinteraksi secara dinamik dengan laman web dan mengendalikan laman web. HTML DOM membolehkan JavaScript menukar kandungan elemen HTML.

<p>

Bagaimana untuk mencari dan mengakses elemen HTML pada halaman HTML? <p> Cari elemen html mengikut id

• Contoh:

Cari elemen HTML mengikut nama label <p>

<code class="language-javascript">const element = document.getElementById("intro");</code>

Contoh:
• Cari elemen html mengikut nama kategori

<p>

Contoh:

<code class="language-javascript">const element = document.getElementsByTagName("p");</code>

• Gunakan pemilih CSS untuk mencari elemen HTML

Gunakan kaedah untuk mencari semua elemen HTML yang sepadan dengan pemilih CSS yang ditentukan (ID, nama kelas, jenis, atribut, nilai atribut, dll.). <p>

Contoh: Cari elemen perenggan dengan jenis "intro":

<code class="language-javascript">const x = document.getElementsByClassName("intro");</code>

• Gunakan koleksi objek HTML untuk mencari elemen HTML

<p> nod (nod) querySelectorAll()

<p> kandungan Dom adalah nod, seperti unsur, teks, atribut.

<code class="language-javascript">const x = document.querySelectorAll("p.intro");</code>

nod elemen:

• bermaksud elemen HTML atau XML. Contohnya: ,
,

, <p>, dll.

Dalam contoh di atas, <p> adalah nod elemen.

<p> nod teks:

menunjukkan kandungan teks dalam elemen. <p> <div> <h1> Teks dalam elemen "Hello, World!" <p> <span> Buat elemen HTML baru (nod):

<code class="language-html"><h1>Hello, World!</h1></code>

<p> <h1> Buat Elemen:

Gunakan kaedah <p> untuk membuat elemen HTML. Buat nod teks:

Gunakan <p> untuk membuat nod teks.

<code class="language-html"><h1>Hello, World!</h1></code>

Tambahkan teks ke elemen: <p> Gunakan kaedah <h1> untuk menambah nod teks ke elemen yang dicipta.

<p> Buat elemen div: Gunakan Buat

elemen sekali lagi.

1. Masukkan elemen ke dalam div: Letakkan unsur -unsur yang dicipta di bahagian depan ke dalam div. document.createElement() Masukkan div ke dalam dokumen:
Akhirnya, tambahkan div ke subjek dokumen (atau mana -mana elemen induk lain yang diperlukan).
2. Contoh serpihan kod (kod yang sedikit ditakrifkan, hanya mengekalkan bahagian utama): document.createTextNode()
3. Tukar gaya HTML: appendChild() tatabahasa:
4. Contoh: () <p>
   <p>Melalui kaedah di atas, anda boleh memanipulasi dan mengubah suai kandungan web dengan berkesan.

Atas ialah kandungan terperinci JavaScript - Model Objek Dokumen (DOM). Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!