1

私の問題は getComputedStyle メソッドに固有のものです。ie9 は getComputedStyle をサポートしていますが、getComputedStyle の疑似要素はサポートしていません。通常、私はこのような小切手を使用します。

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

ただし、ie9 では getComputedStyle がサポートされているため (ただし、疑似要素はサポートされていません)、これは true を返します。ブラウザが擬似要素でこのメソッドをサポートしているかどうかを確認するにはどうすればよいですか?

4

2 に答える 2

1

編集/補遺:getComputedStyle() IE9と他のブラウザーの詳細を掘り下げようとしていることに気づきました。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です。このガイドを正規表現(別名:regex)に使用すると、理解できると思います。

/区切り文字です。魔法はそれらの間で起こります。は-単にダッシュに一致しています。これ\Dは、「数字以外の文字と一致する」という意味の特殊な表記法です。また、これgiは正規表現呼び出しに固有であり、ここでは次のように説明されています。「gi修飾子は、文字列内の正規表現のすべての出現を大文字と小文字を区別せずに検索するために使用されます。」</ p>

ネストされた関数は、正規表現の一致に作用し、replace基本的に一致に作用し.toUpperCase()ます。

それで、あなたが検出しようとしているより深い機能に一致するようにこれを適応させることができるかもしれないように思われますか?

于 2013-01-28T03:38:57.340 に答える
0

これを行うにはおそらくより良い方法がありますが、CSS(またはJS)を使用して特定の疑似要素を追加すると、次のように存在するかどうかを確認できます。

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

この例では、bodyタグに:afterセレクターを追加し、スタイルシート内からcontentプロパティを追加しました(このプロパティの値は何でもかまいません)。

于 2013-01-28T04:03:31.897 に答える