动态加载CSS样式表上的IE浏览器不工作(Dynamically loading css style

我动态加载CSS样式表（从jQuery的一点帮助）是这样的：

var head = document.getElementsByTagName('head')[0];
$(document.createElement('link'))
    .attr({ type: 'text/css', href: '../../mz/mz.css', rel: 'stylesheet' })
    .appendTo(head);

这在Firefox和谷歌浏览器工作正常，但不是在IE浏览器。

任何帮助吗？ 谢谢

Answer 1:

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

请参阅MSDN文章上createStyleSheet几更多细节。

url = 'style.css';
if (document.createStyleSheet)
{
    document.createStyleSheet(url);
}
else
{
    $('<link rel="stylesheet" type="text/css" href="' + url + '" />').appendTo('head'); 
}

Answer 2:

您需要设置在href ATTR最后，只有链接ELEM被附加于头后：

$('<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 = 'stylesheet';
link.type = 'text/css';
link.href = '/includes/style.css';
document.getElementsByTagName('head')[0].appendChild(link);

Answer 4:

这可能也有一些做它-来自微软支持文章 ：

网页上的样式是丢失或不正确时，当页面加载在Microsoft Internet Explorer的版本...

......发生此问题，因为满足下列条件在Internet Explorer，则：

• 第31个风格的标签后，所有的风格标签不适用。

• 第一4,095规则之后的所有样式规则不适用。

• 在使用了@import规则不间断的导入外部样式表导入其他样式表，样式表是超过三个层次的深度被忽略的页面。

Answer 5:

看起来

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

只要URL是一个完全合格的URI包括协议的工作也是在IE浏览器...

Answer 6:

打开IE8没有调试器中打开。 当你到动态样式表后点...打开调试器，瞧，他们应该在那里。

文章来源: Dynamically loading css stylesheet doesn't work on IE