动态加载CSS样式表在IE上不起作用

Question

我动态加载css样式表（在jQuery的帮助下），如下所示：var head = document.getElementsByTagName('head')[0];$(document.createElement('link'))    .attr({ type: 'text/css', href: '../../mz/mz.css', rel: 'stylesheet' })    .appendTo(head);在Firefox和Google Chrome浏览器中可以正常运行，但在IE中则不能。有什么帮助吗？谢谢

Answer 1

IE处理完页面加载的所有样式后，添加另一种样式表的唯一可靠方法是 document.createStyleSheet(url)

有关更多详细信息，请参见createStyleSheet上的MSDN文章。

url = 'style.css';

if (document.createStyleSheet)

{

    document.createStyleSheet(url);

}

else

{

    $('<link rel="stylesheet" type="text/css" href="' + url + '" />').appendTo('head'); 

}

Answer 2

仅在链接元素附加到头部之后，才需要最后设置href属性：

$('<link>')

  .appendTo('head')

  .attr({type : 'text/css', rel : 'stylesheet'})

  .attr('href', '/css/your_css_file.css');

Answer 3

这似乎在IE中也有效：

var link = document.createElement（'link'）;

link.rel ='样式表';

link.type ='text / css';

link.href ='/includes/style.css';

document.getElementsByTagName（'head'）[0] .appendChild（link）;