IE9 tidak lagi serasi ke belakang dengan document.createElement - petua javascript

Hari ini saya mendapati bahawa pada tapak web, fungsi halaman dalam IE9 dan chrome sebenarnya berbeza, jadi saya membuka konsol di bawah IE9 dan mendapati banyak ralat js saya menjejakinya dengan fiddler ialah ayat dalam kod seperti ini:

if(ie){
  var iframe = document.createElement('<iframe src="http://www.jb51.net"></iframe>');
}

Ya, masalahnya terletak di sini: Pengecualian DOM: INVALID_CHARACTER_ERR (5)
Oleh kerana dalam IE9, beberapa kaedah telah menghampiri piawaian w3c dan konsisten dengan firefox, penyemak imbas chrome, dsb., termasuk kaedah document.createElement di sini.
Oleh itu, kod di sini perlu ditukar kepada:

if(ie && version < 9) {
  var iframe = document.createElement('<iframe src="http://www.jb51.net"></iframe>');
} else {
  var iframe = document.createElement('iframe');
  iframe.setAttribute('src','http://www.jb51.net');
}

Walau bagaimanapun, jika teg meta ini ditambahkan pada halaman, mod dokumen IE9 boleh diturunkan taraf secara paksa kepada IE7:

ac1556b0d4238e1d272cf8fa18f10874

Ini boleh memintas BUG ini, ​​tetapi cadangan saya ialah jika tiada apa-apa yang istimewa pada halaman yang tidak dapat dikendalikan, jangan tambahkan kekuatan sedemikian, kerana ia akan membawa kepada beberapa fenomena yang tidak terkawal dalam mod biasa.

Di sini, saya juga akan menyenaraikan beberapa perbezaan dalam pelbagai versi IE yang saya ingat:

1, IE6
a. Imej lut sinar PNG tidak disokong dan hanya boleh dicapai menggunakan penapis
b. Lebar maks, ketinggian maks, lebar min dan ketinggian minimum css tidak disokong
Tidak perlu dikatakan, segala-galanya adalah kucar-kacir, tetapi keserasian masih perlu dilaksanakan dalam projek!

2, IE7
a. Menyelesaikan masalah sokongan imej lut sinar png
b. Menyelesaikan masalah sokongan lebar maksimum, ketinggian maksimum, lebar min dan ketinggian min bagi css
c. Menyelesaikan pepijat yang disebabkan oleh css float
d. Pemilih css yang dipertingkatkan Contohnya, nod div juga menyokong kelas pseudo :hover
Walaupun ia menyelesaikan banyak masalah IE6, IE7 sentiasa merupakan produk perantaraan, dan selalunya terdapat masalah gaya yang mengelirukan Dalam keadaan biasa, zum:1 adalah mahakuasa

3. IE8
a. Menyokong sepenuhnya pemilih CSS2.1, selaraskan dengan w3c, dan secara beransur-ansur menyeragamkan
b. Mengalih keluar sokongan untuk ungkapan dalam css dan menambah awalan peribadi -ms-
Dari segi c dan js, localStorage disokong
d. Memandangkan terdapat banyak versi, mod keserasian UA telah dibangunkan: X-UA-Compatible

4, IE9
a, sokongan css3 (separa)
b. sokongan html5 (separa)
Walau bagaimanapun, enjin Javascript telah digantikan oleh chakra Prestasinya sangat baik, dan ia juga mencerminkan bahawa beberapa operasi DOM tidak lagi serasi ke belakang. Pada masa ini, IE9 telah mencapai penyeragaman w3c.

5, IE10
a. Sokongan kuat untuk css3 dan html5
b. Lebih banyak atribut -ms-private (dengan lebih banyak atribut peribadi, adakah ia akan sesat lagi? Sudah tentu, di sinilah chrome dan firefox mendahului... semua jenis atribut peribadi!!!)

Ringkasnya, sebagai pembangun bahagian hadapan, kami perlu mengikuti perubahan dan menyesuaikan diri dengan perubahan ini.