Tahukah anda bahawa kita dapat menggunakan JavaScript untuk memanipulasi kandungan di laman web? Nampak Menarik Betul? Mari kita fahami apa itu Model Objek Dokumen. DOM dalam JavaScript dengan cara berikut:
- Apakah DOM dalam JavaScript?
- Tindakan DOM dalam JavaScript
- Menanyakan DOM
- Mendengarkan Acara
- Berinteraksi dengan Bentuk
- Membuat Elemen HTML
- Menambah CSS
Apakah DOM dalam JavaScript?
Model Objek Dokumen atau DOM dibuat oleh penyemak imbas semasa halaman web dimuat. Dalam bentuk grafik, itu seperti pohon unsur yang juga disebut simpul, yang digunakan untuk mewakili setiap elemen di halaman.
Semua DOM laman web kami terletak di dalam objek dokumen. Secara terprogram, model ini membolehkan kami membaca atau mengubah kandungan halaman kami melalui . Bukankah ia sejuk?
kaedah kelas pengimbas yang manakah membaca rentetan
Tindakan DOM dalam JavaScript
Beberapa tindakan yang dapat kita lakukan dengan model ini adalah:
Tukar / Buang elemen HTML di DOM / di halaman.
Ubah dan tambahkan gaya CSS pada elemen
Baca dan ubah atribut (href, src, alt), dll.
Buat elemen baru dan masukkan ke dalam DOM / halaman.
apakah serialisasi di java
Lampirkan pendengar acara ke elemen (klik, tekan kekunci, hantar)
Menanyakan DOM dalam JavaScript
Mendapatkan elemen HTML atau mendapatkannya untuk menambah / mengubah atau kandungan disebut query.
Kod HTML:
Javascript dan DOM h1 {font-size: 60px}
Kod JavaScript:
var title = document.getElementById ('title') // warna cgangin menjadi tajuk merah.style.color = 'red' var body = document.getElementById ('body') // menukar warna latar ke badan biru muda.style. backgroundColor = 'cahaya biru'
Kami menukar warna teks tajuk dari hitam menjadi merah menggunakan JavaScript. Kami mencapai ini dengan menggunakan gaya harta kemudian menukar nilai warna sama dengan bersih .
Sekarang mari kita ubah warna latar elemen badan menjadi biru muda .
cara menukar binari ke perpuluhan dalam java
Dengan ini, kita akan mengakhiri DOM ini dalam artikel JavaScript. Saya harap anda mendapat pemahaman tentang bagaimana Model Objek Dokumen berfungsi dan bagaimana menerapkan DOM yang sama dalam JavaScript.
Sekarang setelah anda mengetahui tentang DOM dalam JavaScript, lihat oleh Edureka. Latihan Persijilan Pembangunan Web akan membantu anda belajar bagaimana membuat laman web yang mengagumkan menggunakan HTML5, CSS3, Twitter Bootstrap 3, jQuery dan Google API dan menyebarkannya ke Amazon Simple Storage Service (S3).
Ada soalan untuk kami? Sila sebutkan di bahagian komen 'DOM dalam JavaScript' dan kami akan menghubungi anda.