' untuk perenggan, '
' untuk tajuk tahap pertama, dll. Pendekatan ini diperlukan apabila pengguna perlu mengakses elemen HTML dengan nama tegnya secara langsung dan bukannya mencari berbilang baris kod.
Panduan ini akan menerangkan prosedur lengkap untuk mengambil nama teg unsur HTML menggunakan JavaScript.
Bagaimana untuk Mengambil Nama Teg Elemen HTML Menggunakan JavaScript?
JavaScript menawarkan 'baca sahaja' tagName ” harta yang memaparkan nama tag bagi elemen HTML yang sepadan. Ia mengembalikan nilai rentetan iaitu, nama tag elemen dalam huruf besar.
Sintaks
unsur. tagName
Dalam sintaks di atas, ' tagName ” sepadan dengan nama tag elemen yang perlu diambil.
Sekarang, mari kita beralih kepada pelaksanaan praktikalnya untuk menyemak cara ia boleh digunakan untuk mengambil nama teg bagi elemen HTML yang sepadan.
Contoh: Menggunakan Harta 'tagName' untuk Mengambil Nama Tag Elemen HTML
Dalam contoh ini, semua nama tag elemen yang dinyatakan dalam kod HTML boleh diambil melalui ' tagName ” harta benda.
Kod HTML
Mari kita lihat kod HTML berikut:
< badan onclick = 'ElemName()' >< h2 > Ambil tagNama Elemen HTML Dalam JavaScript < / h2 >
< hlm > Klik pada mana-mana elemen dalam dokumen ini untuk mendapatkan nama tegnya. < / hlm >
< butang > Klik Ia < / butang >
< hlm ID = 'demo' >< / hlm >
Dalam baris kod di atas:
- '
tag ' dikaitkan dengan ' onclick ' acara mengubah hala ke fungsi JavaScript ' elemName() ” yang akan dicetuskan dengan satu klik. - ' teg ” mentakrifkan subtajuk.
- ' teg ” mencipta pernyataan perenggan.
- '
tag ” menambah butang bernama “Klik Ia”. - Akhir sekali, ' teg ' mentakrifkan perenggan kosong yang mempunyai id ' demo ” untuk memaparkan nama teg unsur HTML pada pencetus peristiwa “onclick”.
Kod JavaScript
Seterusnya beralih ke kod yang disediakan di bawah:
< skrip >fungsi elemName ( ) {
const unsur = peristiwa. sasaran ;
dokumen. getElementById ( 'demo' ) . innerHTML = 'Nama teg Elemen HTML yang diklik ialah: ' + unsur. tagName ;
}
skrip >
Dalam blok kod ini:
- Tentukan fungsi bernama “ elemName() ”.
- Dalam definisinya, isytiharkan pembolehubah ' unsur 'jenis data' const ” yang menggunakan “ sasaran ” harta untuk mengembalikan nama elemen apabila peristiwa yang berkaitan dicetuskan.
- Akhir sekali, gunakan ' getElementById() ” kaedah untuk mengakses perenggan yang ditambahkan menggunakan idnya.
- Ia akan menyebabkan memaparkan nama tag bagi elemen HTML yang sepadan menggunakan “ tagName ” harta apabila peristiwa “onclick” akan dicetuskan.
- Oleh itu, apabila mengklik mana-mana elemen dalam kod HTML, nama tag yang sepadan akan diambil semula.
Pengeluaran
Output menunjukkan nama teg unsur yang sepadan dengan peristiwa 'onclick' dicetuskan dengan sewajarnya.
Kesimpulan
JavaScript menyediakan ' terbina dalam tagName ” harta untuk mendapatkan nama tag elemen HTML. Ia biasanya digunakan dengan pengendali acara JavaScript seperti 'onclick', 'onmouseover', 'ondblclick' dsb. Apabila acara berkaitan elemen HTML dicetuskan, ia mengembalikan nama tegnya dalam huruf besar secara lalai. Panduan ini telah memberikan penerangan ringkas tentang cara mengambil nama teg bagi elemen HTML menggunakan JavaScript.