Como todos sabemos, aqueles que fazem o desenvolvimento do front-end querem chutar os desenvolvedores do IE algumas vezes. A reputação dos desenvolvedores do IE não é menos do que os desenvolvedores da GFW. Eles arruinam o mercado contra sua consciência, e todos podem puni -los. No entanto, nesses lugares na China, não há como se curvar à realidade.
Recentemente, nosso produto precisa carregar dinamicamente um pedaço de CSS no navegador, e o código anterior foi usado diretamente:
A cópia do código é a seguinte:
var bubblecss = document.createElement ('estilo');
bubblecss.type = 'text/css';
bubblecss.innerhtml = blc_conf.bubblestyle;
Document.getElementsByTagName ('Head') [0] .AppendChild (Bubblecss);
No entanto, isso é suportado apenas pelo IE9, e haverá problemas no IE8. Eu nunca notei isso. Não o encontrei até que recentemente refatei e fiz um teste completo.
Encontrei um truque online. Eu tentei e funciona, mas há alguns problemas
A cópia do código é a seguinte:
window.bc_bubble_css = blc_conf.bubblestyle;
document.createstylesheet ("javascript: bc_bubble_css");
Aqui você pode criar um estilo definido pela variável bc_bubble_css. No entanto, como o HTML5 está gradualmente se tornando popular, alguns seletores de CSS3 também são misturados em nosso CSS. O uso deste método fará com que o analisador IE8 faça uma exceção quando analisou o analisado com o seletor CSS3 e interrompe o analisamento do CSS subsequente. Isso faz com que o CSS seja carregado apenas no meio do caminho. Os métodos encontrados on -line devem usar a adição de tipo de folha de estilo para aumentar, mas isso exige que você especifique o seletor e o estilo CSS2.
Portanto, é necessário desmontar uma única regra do CSS e, em seguida, ligar para o AddRule, por sua vez. Exemplo:
A cópia do código é a seguinte:
var s = document.createstylesheet ();
var regras = blc_conf.bubblestyle.replace (///*[^/*]*/*// g, "") .replace (/@[^{]*/{/g, '') .match (/[^/{/}]+/{[^/}]+/}/g);
for (var i = 0; i <regras.length; i ++) {
var m = regras [i] .match (/(.*)/ s*/{/s*(.*)/}/);
if (m) {
tentar {
s.Addrule (m [1], m [2]);
} catch (e) {
}
}
}
Existem duas substituições no início, removendo o olhar e parte do seletor CSS3, mas ainda existem seletores que perdem a rede e você precisa pegá -lo mais tarde tentando capturar.
Além disso, eu desprezo aqueles que desenham interfaces de novo