0

目標は、css3 nth-child 疑似クラスを jQuery で pollyfill することです。そのため、css ルールを解析し、css から直接 nth-child をサポートしていない古いブラウザー用に jQuery でそれらを再適用する必要があります。だから私はいくつかのコードを書きましたが、似たようなものがすでにgithubなどに存在していると確信しています。誰かがすでにそのような問題に遭遇している可能性がありますか? これが私のコードです：

        // if ie7 or ie8
        if (!$.support.leadingWhitespace) {         

            var aStyleSheetList = document.styleSheets,
                aRules = [],
                current = '',
                aSelectors = [];

            for (var i = 0; i < aStyleSheetList.length; i++) {
                aRules = aStyleSheetList[i].cssRules || aStyleSheetList[i].rules;
                for (var j = 0; j < aRules.length; j++) {
                    current = aRules[j];
                    if (current.selectorText && current.selectorText.indexOf('nth-child') !== -1) {
                        aSelectors.push([current.selectorText, current.cssText.substring(current.cssText.indexOf('{') + 1, current.cssText.indexOf('}'))]);
                    }
                }
            }

            var jqCssObject = {},
                declarations = [],
                keyValuePair = [];

            for (var k = 0; k < aSelectors.length; k++) {
                declarations = aSelectors[k][1].split(';');
                for (var m = 0; m < declarations.length; m++) {
                    keyValuePair = declarations[m].split(':');
                    jqCssObject[keyValuePair[0]] = keyValuePair[1];
                }
                $(aSelectors[k][0]).css(jqCssObject);                   
            }

        }
4

1 に答える 1

1

nth-child古いブラウザーなどで擬似セレクターを使用する場合、1 つのオプションはSelectivizrを使用することです。

「Selectivizr は、Internet Explorer 6 ～ 8 で CSS3 疑似クラスと属性セレクターをエミュレートする JavaScript ユーティリティです。」

すでに jQuery を使用しているため、ページに Selectivizr<script>を含めるだけで、古いブラウザーのさまざまな擬似/属性セレクターとの互換性が得られます。

于 2013-06-02T19:32:38.617 に答える