使用HTML5的自定义数据属性上的jQuery选择器

jQuery UI有一个:data()选择器，也可以使用。从1.7.0版开始就出现了。

您可以像这样使用它：

获取具有data-company属性的所有元素

var companyElements = $("ul:data(group) li:data(company)");

获取data-company等于的所有元素Microsoft

var microsoft = $("ul:data(group) li:data(company)")
                    .filter(function () {
                        return $(this).data("company") == "Microsoft";
                    });

获取所有data-company不相等的元素Microsoft

var notMicrosoft = $("ul:data(group) li:data(company)")
                       .filter(function () {
                           return $(this).data("company") != "Microsoft";
                       });

等等...

新:data()选择器的一个警告是，必须通过代码设置data值才能选择它。这意味着，要使以上内容起作用，仅以HTML 定义是不够的。您必须首先执行以下操作：data

$("li").first().data("company", "Microsoft");

对于您可能以$(...).data("datakey", "value")这种方式或类似方式使用的单页应用程序来说，这很好。