Artikel yang sangat bagus tentang perbezaan antara js dan css dalam IE dan FireFox [Dicetak semula daripada Catching Fire]_Pertukaran pengalaman

Saya melihat artikel ini tentang Biru, dan saya rasa penulis meringkaskannya dengan baik, sekurang-kurangnya beberapa daripadanya saya tidak pernah tahu sebenarnya. Benda-benda ni memang patut diringkaskan, tapi malangnya saya seorang yang malas, jadi saya kumpulkan di sini untuk memudahkan pembelajaran saya sendiri!

1.firefox tidak boleh menyokong innerText.
Firefox menyokong innerHTML tetapi bukan innerText Ia menyokong textContent untuk melaksanakan innerText, tetapi ruang tambahan juga dikekalkan secara lalai. Jika textContent tidak digunakan, innerHTML boleh digunakan sebaliknya jika rentetan tidak mengandungi kod HTML.
2. Lumpuhkan pemilihan kandungan halaman web:
Secara amnya gunakan js dalam IE: obj.onselectstart=function(){return false;}
Dan firefox menggunakan CSS:-moz- pengguna -select:none

3. Sokongan penapis (contohnya: penapis lutsinar):
IE:penapis: alpha(opacity=10); -opacity:.10;


4. Acara tangkap: IE: obj.setCapture(), obj.releaseCapture()
Firefox: document.addEventListener(" mousemove ",mousemovefunction,true);
document.removeEventListener("mousemove",mousemovefunction,true);


5. Dapatkan kedudukan tetikus:
IE:event.clientX , event.clientY firefox: Fungsi acara diperlukan untuk melepasi objek acara
obj.onmousemove=function(ev){
　🎜>
6.Isu sempadan DIV dan elemen lain:

Contohnya: menetapkan CSS div: {width:100px;height:100px;border:#000000 1px solid;}
IE Medium: lebar div (termasuk lebar sempadan): 100px, ketinggian daripada div (termasuk lebar sempadan): 100px; Dan firefox: lebar div (termasuk lebar sempadan): 102px, tinggi div (termasuk lebar sempadan):

Jadi apabila membuat tetingkap seret ini yang serasi dengan IE dan Firefox, anda perlu menggunakan otak anda semasa menulis js dan css Berikut adalah dua petua untuk anda

Satu . semua? true:false;
Saya menulis pembolehubah jika ia menyokong sintaks document.all, maka isIE=true, sebaliknya isIE=false

2. Pemprosesan CSS di bawah pelayar yang berbeza:
Secara amnya, anda boleh menggunakan !important untuk mengutamakan penggunaan pernyataan CSS (hanya disokong oleh Firefox)
Contohnya: {border-width:0px!important;border-width:1px;}
Elemen ini tidak mempunyai sempadan di bawah Firefox , dan lebar sempadan ialah 1px di bawah IE


Beberapa perbezaan antara XHTML dan JS dan CSS biasa

Pada halaman web Menambah kod ini pada permulaan ialah apa yang dipanggil standard XHTML


Beberapa perbezaan di bawah standard XHTML:
1.document.documentElement dan document.body
Tetapkan CSS halaman dalam kod Pastikan anda menggunakan: document.documentElement nbsp;html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">Contohnya: document.documentElement.style.overflow='hidden';
overflow-X, overflow-Y, kedua-dua atribut koordinat ini tidak disokong oleh XHTML

2 digunakan apabila mendapatkan kawasan tetingkap halaman web dan jarak anjakan bar skrol
Iaitu, empat sifat ini (clientWidth, clientHeight, scrollLeft, scrollTop) mesti menggunakan document.documentElement
Tetapi document.body.appendChild() dan document .body.removeChild() boleh digunakan, tetapi menggunakan document.documentElement.appendChild() dan document.documentElement.removeChild() sebaliknya akan melaporkan ralat; , scrollLeft, scrollTop dan document.documentElement.style

3 Selepas menambah standard ini, masalah sempadan IE juga telah berubah, dan ia kini konsisten dengan firefox , adakah ini kelebihan XHTML - penyemak imbas silang standard
disebutkan di atas:
Tetapkan CSS div:: {width:100px;height:100px;border:#000000 1px solid;}
Dalam IE (situasi biasa): lebar div (termasuk sempadan lebar): 100px, tinggi div (termasuk lebar sempadan): 100px;
firefox (situasi biasa):: lebar div (termasuk lebar sempadan): 102px, tinggi div (termasuk lebar sempadan):

Selepas menambah standard XHTML (IE dan Firefox diselaraskan, ^_^):
Dalam IE (XHTML): lebar div (termasuk lebar sempadan): 102px, ketinggian div (termasuk lebar sempadan): 102px; >firefox (XHTML):: lebar div (termasuk lebar sempadan): 102px, ketinggian div (termasuk lebar sempadan): 102px;