Ringkasan kaedah biasa untuk mendapatkan elemen dalam kemahiran JavaScript_javascript

Terdapat tiga cara biasa untuk mendapatkan elemen, iaitu melalui ID elemen, melalui nama tag dan melalui nama kelas.

getElementById

DOM menyediakan kaedah yang dipanggil getElementById, yang akan mengembalikan objek nod yang sepadan dengan atribut id. Sila beri perhatian kepada sensitiviti kes apabila menggunakannya.

Ia adalah fungsi unik untuk objek dokumen, dan kaedah ini hanya boleh dipanggil melaluinya. Cara penggunaannya adalah seperti berikut:

Salin kod Kod adalah seperti berikut:

document.getElementById('demo') //demo ialah ID yang sepadan dengan elemen

Kaedah ini serasi dengan penyemak imbas arus perdana, malah IE6, dan boleh digunakan dengan berani.

getElementsByTagName

Kaedah ini mengembalikan tatasusunan objek (HTMLCollection tepatnya, ia bukan tatasusunan dalam erti kata sebenar), setiap objek sepadan dengan elemen dengan teg yang diberikan dalam dokumen. Sama seperti getElementById, kaedah ini hanya menyediakan satu parameter dan parameternya ialah nama teg yang ditentukan Kod sampel adalah seperti berikut:

Salin kod Kod adalah seperti berikut:

document.getElementsByTagname('li') //li ialah nama tag

Perlu diingat bahawa selain dipanggil oleh objek dokumen, kaedah ini juga boleh dipanggil oleh elemen biasa. Contohnya adalah seperti berikut:

Salin kod Kod adalah seperti berikut:

var demo = document.getElementById('demo');
var lis = demo.getElementsByTagname('li');

Begitu juga, kaedah ini serasi dengan penyemak imbas arus perdana, malah IE6, dan boleh digunakan dengan berani.

getElementsByClassName

Selain mendapatkan elemen dengan menentukan teg, DOM juga menyediakan kaedah getElementsByClassName untuk mendapatkan elemen dengan nama kelas yang ditentukan. Walau bagaimanapun, kerana kaedah ini agak baharu, pelayar lama belum lagi menyokongnya, seperti IE6. Walau bagaimanapun, kita boleh menggunakan penggodaman untuk mengimbangi kekurangan pelayar lama. Kaedahnya dipanggil seperti berikut:

Salin kod Kod adalah seperti berikut:

document.getElementsByClassName('demo') //demo ialah nama kelas yang ditentukan untuk elemen

Sama seperti getElementsByTagname, kaedah ini boleh dipanggil oleh elemen biasa sebagai tambahan kepada objek dokumen.

Untuk pelayar lama, seperti IE6 dan 7, kami boleh menggunakan penggodam berikut:

Salin kod Kod adalah seperti berikut:

fungsi getElementsByClassName(nod,nama kelas){
If(node.getElementsByClassName) {
                kembalikan node.getElementsByClassName(classname);
         } lain {
          keputusan var = [];
              var elems = node.getElementsByTagName("*");
untuk(var i = 0; i < elems.length; i ){
If(elems[i].className.indexOf(classname) != -1){
keputusan[results.length] = elem[i];
                }
            }
             kembalikan hasil;
}
}  

Kembangkan

Jika anda bukan sahaja berpuas hati dengan kaedah pemilihan elemen di atas, tetapi juga ingin mendapatkan elemen melalui pemilih seperti JQuery Kaedah pelaksanaan adalah serupa dengan getElementsByClassName di atas. Jika anda berminat, anda boleh melaksanakan set pemilih sendiri . Walau bagaimanapun, saya rasa tiga kaedah di atas digabungkan dengan acara menggelegak sudah memadai, ketiga-tiga kaedah ini dianggap cemerlang dari segi prestasi.

Di atas adalah keseluruhan kandungan artikel ini, saya harap ia dapat membantu semua orang.