代码之家  ›  专栏  ›  技术社区  ›  Jesper Wilfing

使用jQuery或类似工具从CSS文件中指定的样式中获取“#myDiv:hover”样式

  •  1
  • Jesper Wilfing  · 技术社区  · 10 年前

    我需要检查是否为CSS规则中的某些元素指定了“:hover”或“:active”样式。如果这些元素具有指定的规则,我需要在 $(document).ready 为ie6添加一些不支持div上的“:hover”或“:active”的事件。

    我可以向需要“修复”的特定元素添加一个类,但我希望脚本能够基于CSS中指定的内容工作。这会使它更具活力。。。

    $('#elem').is(":hover") 不会有助于选择元素,因为我需要在实际悬停之前知道。

    如果不加载文件“ajax样式”(这不是一个选项),可能很难/不可能做到这一点。。。

    PS:是的,当然不应该鼓励使用IE6,但中国拥有2亿台XP机器和22%的IE6(截至2014年3月)是一个非常重要的市场( source ).

    1 回复  |  直到 5 年前
        1
  •  0
  •   zord    10 年前

    您可以扫描所有css规则以查找包含 :hover :active ,然后处理 cssText 不管你喜欢什么规则。

    var iSheet, sheet, iRule, rules, rule;
    for (iSheet=0; iSheet<document.styleSheets.length; iSheet++) {
        sheet = document.styleSheets[iSheet];
        rules = sheet.rules || sheet.cssRules;
        for (iRule=0; iRule<rules.length; iRule++) {
            rule = rules[iRule];        
            if (rule.selectorText.indexOf(":hover") > -1) {
                console.log(rule.cssText);
            }
        }
    }
    

    这里有一个 jsfiddle .