jquery - 使用 jQuery 获取特定的 CSS 类

Question

我有一个元素，应用了一些 CSS 规则，如下所示:

<span class="rule1 rule2 rule3[foo/bar]"></span>

我可以使用 jQuery 来检索完整的类列表:

var classes = $("span").attr('css');

如何选择特定规则，在本例中为规则 3 及其数组内容？

Answer 1

您不应该使用 css 类来存储信息。 jQuery 提供了将各种数据存储到 data-XXX 属性中的功能，这些属性又被拉入 jQuery 的 .data() Expando 属性中。

在您的示例中，这可能看起来像

<span data-rules='{"rule1":"foo","rule2":"bar","rule3":"baz"}'></span>

这是逻辑的 JSON 字符串化版本。通过使用 jQuery 查询该节点，例如

var myspan = $('span');

您现在可以通过调用访问此数据属性

myspan.data('rules').rule3 // === "baz"

引用:http://api.jquery.com/data/ (部分:HTML 5 数据 - 属性)