0

我有一个包含如下元素的文档：

<ul class="fx-startpoint">
    <li>some text</li>
    <li>other text</li>
</ul>

首先，我需要使用 jQuery 查看所有具有以 . 开头的类的元素fx-。我认为这是可能的，$("class=^fx-")但是我需要查看是否有其他可用的 CSS 文件中的元素类，fx-但它们当前未设置为元素或子元素（如 li 的）。

我怎么能用 jQuery/jQueryUI 做到这一点？

4

3 回答 3

1

选择器class=^fx-只会找到这样的元素：

<div class="fx-foo bar">...</div>

...而不是像这样的：

<div class="bar fx-foo">...</div>

...因为fx-没有出现在属性的开头。如果您可能有第二种形式，可悲的是，您唯一的选择是查看所有元素并过滤掉那些没有fx-xxx类的元素。当前没有“包含以开头的单词”的选择器。

至于查找定义以 开头的类选择器的所有规则fx-，您可以这样做。document.styleSheets为您提供应用于当前文档的所有样式表的列表。每个样式表对象都有一个为其定义的规则列表（这将取决于cssRules或仅rules取决于浏览器的年龄和品牌）。每个规则（CSSStyleRule对象）都将包含有关规则的信息，包括selectorText为您提供规则的完整选择器。因此，您可以解析该选择器以查看它是否定义了以 . 开头的类规则fx-。确保在查看选择器时允许使用逗号（例如，.foo, .fx-bar { ... }），并注意解析选择器字符串虽然不难，但并非易事。

于 2013-02-14T15:17:21.853 回答
0

OP 发布的 jsFiddle 的一个分支：http: //jsfiddle.net/mori57/kgqXY/

function GetAppliedCssRules($element) {
    var appliedRules = [];
    for (var x = 0; x < document.styleSheets.length; x++) {
        var rules = document.styleSheets[x].cssRules;
        for (var i = 0; i < rules.length; i++) {
            var txt = rules[i].selectorText;
            if (txt.indexOf('.fx-') > -1) {
                appliedRules.push(txt);
            }
        }
    }
    return appliedRules;
}

具体来说，您只是将搜索更改为查找 .fx-，这可以通过简单的 .indexOf 来完成。正则表达式也是可能的（正如其他几张海报所提到的）。

于 2013-02-14T15:31:24.827 回答
-2 
var classList =$('#divId').attr('class').split(/\s+/);

classList 返回一个类数组：然后您可以迭代并找到您想要的类。

var classList =$('#divId').attr('class').split(/\s+/);
$.each( classList, function(index, item){
if (item === 'someClass') {
   //do something
}
});
于 2013-02-14T15:16:25.013 回答