Rumah  >  Artikel  >  hujung hadapan web  >  Kaedah JavaScript untuk mendapatkan elemen secara langsung melalui id elemen dan kemahiran name_javascript

Kaedah JavaScript untuk mendapatkan elemen secara langsung melalui id elemen dan kemahiran name_javascript

WBOY
WBOYasal
2016-05-16 16:01:441628semak imbas

Contoh dalam artikel ini menerangkan cara JavaScript boleh mendapatkan elemen secara langsung melalui id dan nama elemen. Kongsikan dengan semua orang untuk rujukan anda. Analisis khusus adalah seperti berikut:

Kami tahu bahawa beberapa perpustakaan js pihak ketiga telah membuat beberapa penyederhanaan tentang cara memilih elemen dalam html dengan cepat ia kelihatan sangat misteri, tetapi sebenarnya tidak. Selain itu, js sendiri datang dengan kaedah mudah untuk memilih elemen khas saya akan memperkenalkannya secara ringkas di bawah.

Dalam HTML, cara paling langsung untuk mengenal pasti elemen HTML secara amnya ialah nama dan atribut id, yang berbeza sedikit: id mestilah unik pada halaman, tetapi nama itu boleh diulang.

Dalam js, jika nama id tidak mempunyai nama yang sama dengan atribut terbina dalam atau pembolehubah global, nama itu secara automatik menjadi atribut objek tetingkap dan dalam persekitaran peringkat atas halaman html terdapat :

this === window

Jadi jika kita menulis kod elemen html seperti berikut, kita boleh merujuknya seperti ini:

<input type="button" id="btn_ok" value="Ok" onclick="..." />
//可以这样引用
btn_ok.onclick = function(){};
//或者下面也是一样的
window.btn_ok.style = ...;

Untuk atribut nama, hanya jenis elemen html tertentu yang mempunyai kaedah yang serupa, seperti: form, img, iframe, applet, embed, object, dsb. Dalam elemen ini, elemen dengan atribut nama tertentu boleh diakses melalui pembolehubah global atau atribut dokumen jika terdapat berbilang elemen dengan atribut nama yang sama, objek tatasusunan baca sahaja seperti NodeList dikembalikan, seperti kod berikut:

<div>
  <img name="pic" src="#" alt="pic_0" />
  <img name="pic" src="#" alt="pic_1" />
  <img name="pic" src="#" alt="pic_2" />
</div>
//我们可以这样引用name为pic的元素:
for(x in pic)
 console.log(pic[x].alt);
//或者是非"标准"语法each语句方式
for each(img in pic)
 console.log(img.alt);

Saya harap artikel ini akan membantu reka bentuk pengaturcaraan JavaScript semua orang.

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn