如何将样式注入 IE8

How do I inject styles into IE8?

本文关键字：注入 IE8 样式      更新时间：2023-09-26
// create a style element
$("#main").html('<style id="custom_persona_css"></style>'); 
$("#custom_persona_css").append('#abc{ color:#000000; }');

如您所知，这在IE8中不起作用！

如何使其在IE8中工作？

将

出现错误："对方法或属性访问的意外调用"，因为 IE8 无法将 html 识别为有效(abc 部分(

在 MSIE 中设置与 <style/> 元素相关的 styleSheet-对象的 cssText-属性：

   $('<style id="custom_persona_css"></style>').appendTo('head'); 
   if($.browser.msie)
   {
    $("#custom_persona_css").prop('styleSheet').cssText='#abc{ color:#000000; }';
   }
   else
   {
    $("#custom_persona_css").append('#abc{ color:#000000; }');
   }

http://jsfiddle.net/doktormolle/BLJUv/

更多信息： http://msdn.microsoft.com/en-us/library/ie/ms533698%28v=vs.85%29.aspx

我同意 jmort253 的观点，也许直接修改样式属性或加载 css 文件是最好的。然后，可以使用更高效的 addClass 和 removeClass 方法。话虽如此，风格元素应该在头脑中(它们当然在正文中起作用，但我记得officially不支持(。所以你可以为此目的做这样的事情。

http://jsfiddle.net/TCUxx/1

$('head').append('<style type="text/css">#abc{ color:#ff0000; }</style>');

已更新 - 由于某种原因，这不起作用。我不知道为什么。适用于IE9。

var $styleElement = $('<style />', {
    type: 'text/css',
    text: '#abc{ color:#ff0000; }'
});
$('head').append($styleElement);

你正在使用jQuery，jQuery有一个庞大的方法库，用于动态改变元素的样式：

$(selector).css(propertyName, value);
$(selector).propertyName(value);

以上只是使用 jQuery 影响由选择器标识的元素或元素组样式的两个示例。

因此，要使用 id="abc" 更改元素的颜色，可以使用以下命令：

$('#abc').css('color','#000000');

此外，如果要为元素或元素组设置主题，则可以创建一个样式.css文件，为不同的类名概述样式。然后，您可以通过向元素添加或删除类名来简单地应用样式，如下所示：

风格.css：

.custom_persona {
    color:#000000;
}
.some_other_custom_style {
    color:red;
    background-color: #fff;
}

索引.html脚本：

$('#abc').addClass('custom_persona');
// OR
$('#abc').addClass('.some_other_custom_style');
$('#abc').removeClass('custom_persona');

jQuery CSS类别的方法和属性在哪些属性可用方面进行了更详细的介绍。 这不仅可以解决您的IE8问题，而且也可以在所有其他主要浏览器中使用。

这是否有效：

var $style = $("#custom_persona_css");
$style.html(
    $style.html() + '#abc{ color:#000000; }'
);

或

$("#custom_persona_css")[0].innerHTML += '#abc{ color:#000000; }'
相关文章：