0

目标是使用 jQuery 填充 css3 nth-child 伪类。因此,我需要解析 css 规则并使用 jQuery 将它们重新应用于不直接从 css 支持 nth-child 的旧浏览器。所以我写了一些代码,但我很确定类似的东西应该已经存在,例如在 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器,一种选择是使用Selectivizr

“Selectivizr 是一个 JavaScript 实用程序,它在 Internet Explorer 6-8 中模拟 CSS3 伪类和属性选择器。”

由于您已经在使用 jQuery,您所要做的就是<script>在页面中包含 Selectivizr,这样您就可以兼容旧浏览器中的各种伪/属性选择器。

于 2013-06-02T19:32:38.617 回答