预先添加 .css 文件 - Firefox 与 IE答案

【问题标题】：Prepend .css file - Firefox vs IE预先添加 .css 文件 - Firefox 与 IE
【发布时间】：2009-10-09 09:40:46
【问题描述】：

当我使用它时，我发现 IE 与 Firefox 有不同的行为

$('head').prepend('');

这基本上只是为了在 HEAD 标记内添加 theme-2.css （出于主题目的）。我这样做是因为我不希望它加载，因为我使用 csspreload http://www.filamentgroup.com/lab/update_automatically_preload_images_from_css_with_jquery/

在 Firefox 中，顶部的 .css 文件将被下面的文件优先接管。这很好用！

在 IE 中，稍后添加到 HEAD 中的 NEW .css 文件将生效。不管是在顶部还是底部。

谢谢

【问题讨论】：

【解决方案1】：

我不完全清楚您在这里要完成什么 - 您是否尝试动态地将样式表添加到页面中不影响页面，以便预加载其图像?

如果是这样，这个 sn-p 可能确实需要你想要的：

$('link[rel="stylesheet"][href="theme-2.css"]').attr('disabled', 'disabled');

这将禁用样式表，但仍将保持加载状态。如果您想在将来重新打开它，您可以这样做：

$('link[rel="stylesheet"][href="theme-2.css"]').removeAttr('disabled');

编辑： 我想，你真正想要的是来自 disabled 属性的功能。您实际上可以在添加该样式表时设置它，它不会应用于页面。上面的 sn-ps 只是演示了如何动态地做到这一点。

【讨论】：

我认为这也可以。但也许他可以像这样包含已经禁用的链接：<link rel="stylesheet" href="theme-2.css" disabled="disabled"> 然后在文档准备好时使用 jQuery 启用它。

【解决方案2】：

首先，在 Internet Explorer 中可能没有一种方法可以成功地完成您想做的事情。除非在 IE 中加载相关样式表后再次添加现有样式表。

其次，为什么不直接修改现有的插件？

调用它：

$.preloadCssImages({extra: [{href: "/css/styles.css"}]});

或者如果您有多个额外的 CSS 文件：

$.preloadCssImages({extra: [{href: "/css/styles.css"}, {href: "/css/styles2.css"}]});

等等

然后，在文件底部的“parseCSS(document.styleSheets)”行之后，插入：

if (settings.extra)
{
    parseCSS(settings.extra);
}

简单易懂。

【讨论】：