Seperti yang kita semua tahu, mereka yang melakukan pengembangan front-end ingin menendang IE beberapa kali. Reputasi pengembang IE tidak kurang dari pengembang GFW. Mereka merusak pasar melawan hati nurani mereka, dan semua orang dapat menghukum mereka. Namun, di tempat -tempat ini di Cina, tidak ada cara untuk tunduk pada kenyataan.
Baru -baru ini, produk kami perlu secara dinamis memuat sepotong CSS di browser, dan kode sebelumnya digunakan secara langsung:
Salinan kode adalah sebagai berikut:
var bubblecss = document.createElement ('style');
bubblecss.type = 'text/css';
bubblecss.innerhtml = blc_conf.bubblestyle;
document.geteLementsbyTagname ('head') [0] .AppendChild (Bubblecss);
Namun, ini hanya didukung oleh IE9, dan akan ada masalah di bawah IE8. Saya tidak pernah memperhatikan ini. Saya tidak menemukannya sampai saya baru -baru ini refactored dan melakukan tes lengkap.
Saya menemukan trik online. Saya mencobanya dan berhasil, tetapi ada beberapa masalah
Salinan kode adalah sebagai berikut:
window.bc_bubble_css = blc_conf.bubblestyle;
document.createstylesheet ("javascript: bc_bubble_css");
Di sini Anda dapat membuat gaya yang ditentukan oleh variabel bc_bubble_css. Namun, karena HTML5 secara bertahap menjadi populer, beberapa pemilih CSS3 juga dicampur ke dalam CSS kami. Menggunakan metode ini akan menyebabkan parser IE8 untuk melempar pengecualian ketika parser diuraikan ke pemilih CSS3 dan berhenti parsing CSS berikutnya. Ini membuat CSS hanya dimuat di tengah jalan. Metode yang ditemukan secara online adalah menggunakan Addrule Tipe Stylesheet untuk meningkat, tetapi ini mengharuskan Anda untuk menentukan pemilih dan gaya CSS2.
Oleh karena itu, perlu untuk membongkar satu aturan dari CSS dan kemudian memanggil Addrule secara bergantian. Contoh:
Salinan kode adalah sebagai berikut:
var s = document.createstylesheet ();
var aturan = blc_conf.bubblestyle.replace (///*[^/*]*/*// g, "") .replace (/@[^{]*/{/g, '') .match (/[^/{/}]+/{[^/}]+/}/g);
untuk (var i = 0; i <ruls.length; i ++) {
var m = aturan [i] .match (/(.*)/ S*/{/s*(.*)/}/);
if (m) {
mencoba {
S.Addrule (M [1], M [2]);
} catch (e) {
}
}
}
Ada dua penggantian di awal, menghilangkan tatapan dan bagian dari pemilih CSS3, tetapi masih ada pemilih yang melewatkan jaringan, dan Anda perlu menangkapnya nanti dengan mencoba menangkap.
Juga, saya membenci mereka yang mendesain antarmuka lagi