如何检查浏览器是否完全支持javascript方法(例如,getComputedStyle伪元素)

How to check if a browser fully supports a javascript method (eg, getComputedStyle pseudo elements)

本文关键字:javascript 例如 方法 getComputedStyle 元素 支持 何检查 检查 浏览器 是否      更新时间:2023-09-26

我的问题特定于getComputedStyle方法。 ie9 支持 getComputedStyle ,但不支持 getComputedStyle 的伪元素。通常我会使用这样的支票。

if ( getComputedStyle ) { ... 
} else { ... stuff for ie9 }

但是,这对于 ie9 返回 true,因为它确实支持 getComputedStyle(尽管它不支持伪元素)。如何检查浏览器是否支持带有伪元素的此方法?

编辑/附录:刚刚意识到您正在尝试深入了解IE9与其他浏览器相比getComputedStyle()的细节。因此,如果此脚本不是您要查找的,请注意,因为它似乎只是测试是否存在getComputedStyle()而不是特定的选择选项。

该网站似乎提供了一种跨浏览器检测getComputedStyle的解决方案。具体来说,页面底部附近的这段代码:

<script type="text/javascript">
// First paramter is a nodes id, second the CSS property you want
function getCSSProperty(sNodeId, sProperty)
{
    var oNode = document.getElementById(sNodeId);
    if(document.defaultView)
    {
        return document.defaultView.getComputedStyle(oNode, null).getPropertyValue(sProperty);
    }
    else if(oNode.currentStyle)
    {
        var sProperty = sProperty.replace(/-'D/gi, function(sMatch)
        {
            return sMatch.charAt(sMatch.length - 1).toUpperCase();
        });
        return oNode.currentStyle[sProperty];
    }
    else return null;
}
alert(getCSSProperty("myDiv", "margin-bottom"));
</script>

编辑:原始海报有一个关于正则表达式逻辑的问题,这是我试图解释的。如果我错了,请告诉我或评论你的想法:

        var sProperty = sProperty.replace(/-'D/gi, function(sMatch)
        {
            return sMatch.charAt(sMatch.length - 1).toUpperCase();
        });

好的,该代码块正在执行正则表达式替换为实际的正则表达式/-'D/gi。使用本指南来描述正则表达式(又名:正则表达式),我想我理解了它。

/是分隔符;魔术发生在它们之间。-只是匹配破折号。'D是一种特殊的表示法,表示"匹配任何非数字字符"。gi特定于正则表达式调用,并在此处解释为:"gi修饰符用于对字符串中正则表达式的所有匹配项进行不区分大小写的搜索。

嵌套函数作用于replace正则表达式中的匹配项,并且基本上对匹配项执行.toUpperCase()

因此,您似乎可以对其进行调整以匹配您尝试检测的更深层次的功能?

可能有更好的方法可以做到这一点,但是如果你使用 CSS(或 JS)添加一个特定的伪元素,你可以像这样检查它是否存在:

if ( window.getComputedStyle(document.body,':after').getPropertyValue('content') === 1 ) {
// Do stuff
} else { 
// ie fall back
}

在此示例中,我向 body 标记添加了一个 :after 选择器,并从样式表中添加了一个内容属性(此属性的值可以是任何值)。

相关文章: