如何用仅使用javascript的IE8及更低版本的CSS文件替换或删除任何特定的CSS属性

How to replace or remove any specific CSS property with css file for IE8 and lower only using javascript?

本文关键字：CSS 文件 替换 删除 属性 任何特 版本 何用仅 javascript IE8      更新时间：2023-09-26

这是我只想用于IE8及更低版本的css代码

background: filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=0 ); / IE6-8 */

但如果用户在IE9上，我想从CSS文件中删除此属性，或者用filter:none 替换

是否可以使用javascript、jquery？我知道我可以使用单独的IE样式表，但只是好奇是否可以使用javascript。

编辑：

这可能像javascript或jquery 中那样吗

// If browser is IE9

然后更换

filter: progid:DXImageTransform.Microsoft.gradient(values)

至filter:none

我认为最简单的方法是使用条件代码在HTML元素上放置一个"IE"类。。。我想我最初是从HTML5样板中得到的http://html5boilerplate.com/

<!doctype html>
<!--[if lt IE 7 ]> <html class="no-js ie" lang="en"> <![endif]-->
<!--[if IE 7 ]>    <html class="no-js ie" lang="en"> <![endif]-->
<!--[if IE 8 ]>    <html class="no-js ie" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
.bg-gradient {background: filter: 0, #999}
.ie .bg-gradient {  
    background: filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=0 ); / IE6-8 */
}

然后简单地使用添加和删除类来删除"元素"类

$(document).ready(function(){
    $('.element').addClass('bg-gradient');
})

非IE浏览器不会呈现过滤器，因此为（IE 6-8除外）的所有浏览器添加或删除过滤器与仅为IE9添加或删除具有相同的效果。另外，我认为ie9支持多个后台属性，所以其他浏览器应该跳过第一个逗号分隔的值——理论上——我还没有测试过

.bg-gradient {background: filter: 0}

是。这在JavaScript中是"可能的"。但这需要在服务器端和客户端同时完成。

在客户端，您需要检测它是否是IE9，然后向服务器发送一个脚本（服务器端JavaScript）请求，该脚本解析CSS文件并替换所有出现的筛选器属性，并将其设置为filter:none，然后将修改后的CSS文件提供给客户端。

PS:IMHO，这将是你能做的最糟糕的事情，我不建议这样做。这只是为了回答你好奇的问题，如果这"在JavaScript中可能"

$(document).ready(function(){
    if ($.browser.msie && $.browser.version < 9) {
         $("#element").css("filter", "progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=0 );")
    }
})

使用条件注释并为IE8及更低版本添加css文件
这是教程

编辑：使用jquery的浏览器检查并使用javascript应用css
使用jQuery.browser.version，您可以获得版本

我看到这里有不同的答案，但我个人会建议以下方法。

有两个CSS类——一个包含IE9的样式，另一个包含所有其他浏览器的样式。

如上所述，使用jQuery.browser API来确定浏览器类型。我建议您将这个字符串（比如"msie9"或"msie8"）作为类添加到"body"或"html"元素中。

一旦完成，IE9的样式将是

body.msie9.ie9特定类别{}

对其他人来说，这将是

.specificClass{}

这将是一个干净的方法。

相关文章：