Rumah > hujung hadapan web > tutorial js > Penjelasan terperinci tentang DOM dalam kemahiran JavaScript_javascript

Penjelasan terperinci tentang DOM dalam kemahiran JavaScript_javascript

WBOY
Lepaskan: 2016-05-16 16:04:47
asal
1302 orang telah melayarinya

Untuk mencapai idea kemerosotan yang lancar, keserasian ke belakang dan pemisahan tanda, perkara pertama yang anda lakukan setiap kali anda menulis kod js ialah kerja ujian dan pemeriksaan yang diperlukan:
Mula-mula tambah kod berikut pada fail js untuk menyemak:

window.onload = function(){
if(!document.getElementsByTagName)  return false;
if(!document.getElementById) return false;
if(!document.getElementsByClassName)  return false;
if(!document.getElementById("selector"))  return false;
if(!document.getElementsByTagName("tag"))  return false;
if(!document.getElementsByClassName("selector"))  return false;
};
Salin selepas log masuk

Fungsi pembalut universal:

var $ = function(id){
   return document.getElementBy Id (id);
}
var addEvent = function(obj,event,fn){  //obj:元素对象名字,event:绑定事件,fn:触发的回调函数
   if(obj.addEventListener){
obj.addEventListener(event,fn,false);
   }
   else if(obj.attachEvent){
obj.attachEvent("on"+event,fn);
   }
}
Salin selepas log masuk

Untuk banyak fungsi yang memerlukan pemuatan dan pelaksanaan halaman, kaedah pengkapsulan window.onload adalah seperti berikut:

function addLoadEvent(func){
var oldonload = window.onload;
if(typeof window.onload != "function")
{
window.onload = func;
}
else
{
window.onload = function()
{
oldonload();
func();
}
}
}
addLoadEvent(firstFunction);
addLoadEvent(secondFunction);

Salin selepas log masuk

Perbezaan JavaScript antara Firefox dan IE:

1. Dalam kebanyakan kes, mengembalikan palsu untuk fungsi pengendali acara boleh menghalang gelagat acara lalai. Contohnya, secara lalai, mengklik elemen akan melompat ke halaman yang ditentukan oleh atribut href bagi elemen.
return false adalah bersamaan dengan terminator, dan return true adalah bersamaan dengan pelaksana.
Ringkasan tiga senario penggunaan kembali dalam js adalah seperti berikut:
jalankan semula true; Mengembalikan hasil pemprosesan yang betul.
kembalikan hasil pemprosesan yang salah;
return; Kembalikan kawalan ke halaman.

2. Selalunya, memberikan panggilan fungsi kepada pembolehubah akan menjadi idea yang baik.

3. Teg noskrip boleh digunakan dalam penyemak imbas yang boleh mengecam teg skrip tetapi tidak boleh menyokong skrip di dalamnya. Jika penyemak imbas menyokong skrip, ia tidak akan memaparkan teks dalam teg noskrip.

4. Apabila menetapkan gaya secara dinamik, sebaiknya gunakan CSS apabila mungkin.

5. Dalam fungsi, objek global disimpan sebagai pembolehubah tempatan untuk mengurangkan carian global, kerana mengakses pembolehubah tempatan lebih cepat daripada mengakses pembolehubah global.

6 Jika anda menyasarkan kod yang sentiasa berjalan, anda tidak seharusnya menggunakan setTimeout, tetapi setInterval, kerana setTimeout akan memulakan pemasa setiap kali dan setInterval hanya akan memulakan pemasa pada permulaan.

7. Jika anda ingin menyambungkan berbilang rentetan, anda harus menggunakan = less dan cuba gunakan operator ternary dan bukannya cawangan bersyarat apabila membuat cawangan bersyarat.

8. Ramai orang suka menggunakan parseInt() sebenarnya, parseInt() digunakan untuk menukar rentetan kepada nombor, bukan antara nombor titik terapung dan integer. .

9. Dalam JavaScript, semua pembolehubah boleh diisytiharkan menggunakan pernyataan var tunggal, iaitu sekumpulan pernyataan untuk mengurangkan masa pelaksanaan keseluruhan skrip.

10 Untuk perubahan DOM yang besar, menggunakan innerHTML adalah lebih pantas daripada menggunakan kaedah DOM standard untuk mencipta struktur DOM yang sama.

11. Apabila objek yang sama menggunakan kaedah penulisan .onclick untuk mencetuskan berbilang kaedah, kaedah yang terakhir akan menimpa kaedah sebelumnya, iaitu apabila peristiwa onclick objek berlaku, hanya pengikatan terakhir yang akan dilaksanakan kaedah. Dengan mendengar acara, tidak akan ada penggantian dan setiap acara terikat akan dilaksanakan.

12 Jika kaedah toString() ditakrifkan untuk penukaran jenis, disyorkan untuk memanggil toString() secara eksplisit, kerana operasi dalaman akan mencuba kaedah toString() objek selepas mencuba semua kemungkinan untuk melihat sama ada ia boleh ditukar kepada String, jadi memanggil kaedah ini secara langsung akan menjadi lebih cekap.

13. Oleh kerana elemet.style hanya boleh mendapatkan gaya sebaris, element.currentStyle.width ialah sifat eksklusif untuk penyemak imbas IE dan getComputedStyle(elemen, null).width ialah sifat unik untuk penyemak imbas Firefox dan Chrome, jadi mengikut urutan Serasi, kaedah untuk mendapatkan gaya dalaman dan luaran adalah seperti berikut (gaya komposit, seperti latar belakang, sempadan, tidak digalakkan, tetapi harus ditulis sebagai backgroundColor, borderWidth):

function getStyle(obj,name) {
   if(obj.currentStyle) {
     return obj.currentStyle[name];
   }
   else
   {
     return getComputedStyle(obj,null)[name];
   }
}
Salin selepas log masuk

Di atas adalah keseluruhan kandungan artikel ini, saya harap anda semua menyukainya.

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
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
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan