如何将样式注入IE8？

// create a style element 
$("#main").html('<style id="custom_persona_css"></style>'); 

$("#custom_persona_css").append('#abc{ color:#000000; }');

正如你所看到的，这在IE8中不起作用！如何将样式注入IE8？

我该如何让它在IE8中工作？

将会有一个错误信息：“意外的调用方法或属性访问”，因为IE8不承认HTML作为有效（ABC部分）

来源

2012-01-29 TIMEX

在MSIE设置相关<style/> - 元素样式表对象的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/

来源

2012-01-29 03:28:33

+1 - 我会为未来收拾好的小块金。 – mrtsherman 2012-01-29 04:04:11

分数。我不知道为什么人们没有一直投票。这是100％符合我的需求。谢谢！ – TIMEX 2012-01-29 09:29:38

你使用jQuery和jQuery有一个巨大的图书馆用于动态改变元素的样式的方法：

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

$(selector).propertyName(value);

以上只是两个的jQuery的使用方法的实施例来影响由选择器识别元素的元素或基团的样式。

因此，要改变使用id =“ABC”的元素的颜色，下面的工作：

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

此外，如果你正在寻找的主题元素的一个或一组，你可以创建一个style.css文件来概述不同classNames的样式。

的style.css：

.custom_persona { 
    color:#000000; 
} 

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

index.html的脚本：

$('#abc').addClass('custom_persona'); 

// OR 

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

然后，你可以简单地通过添加或删除的类名的元素（一个或多个），像这样应用的样式

jQuery CSS category of methods and properties根据可用的属性更详细地介绍。这不仅可以解决您的IE8问题，而且还可以在所有其他主流浏览器中使用。

来源

2012-01-29 02:39:09 jmort253

我不能这样做。因为用户定义了规则，并且我应用了它们。它们并不是一成不变的。 – TIMEX 2012-01-29 02:54:41

你是什么意思用户定义样式？即使用户正在定义样式，您仍然应该能够使用上述技术之一来应用它们。现在，我还没有尝试过这种方法，但是您可以尝试将这些用户提供的样式动态生成为动态CSS文件，并将它们附加到HEAD部分'var i = $（'link'）。attr（“href”，“ /userGenerated.php?userId=555“）; $（'head'）。appendChild（i）;'在这种情况下，userGenerated.php从文件或数据库中提取样式。 – jmort253 2012-01-29 03:09:07

我同意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);

来源

2012-01-29 02:43:21 mrtsherman

+1正是我在想什么。感谢您的验证！ – jmort253 2012-01-29 03:11:06

@mrtsherman：这是否在你的IE8中工作？ – 2012-01-29 03:35:51

@ Dr.Molle - 实际上没有。不，它不。我不知道为什么。如果你只是输入它的代码（更改我的答案）。我试着按照你的答案中的建议设置cssText，但它不起作用。 – mrtsherman 2012-01-29 04:13:41

这是否工作：

var $style = $("#custom_persona_css"); 

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

或者

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

来源

2012-01-29 03:01:10 qwertymk

如何将样式注入IE8？

回答

相关问题