javascript - JQuery：自定义属性关键字选择器

Question

对于一个项目，我在元素上使用自定义属性来指定它们是否具有自定义模板。我需要能够使用基于关键字的自定义模板来选择元素。我做了一个简化的案例来演示。

因此，例如：

<div jk_template="blue">Blue</div>
<div jk_template="red">Red</div>
<div jk_template="red big">Red Big</div>

我试过了：

$('[jk_template="blue"]').css('color', 'blue');
$('[jk_template="red"]').css('color', 'red');
$('[jk_template="red big"]').css('font-size','22px');

不幸的是，red big唯一出现的字体较大，但不是红色。

我还希望能够根据缺少属性来选择没有自定义模板的元素。仅使用 JQuery 选择器就可以实现所有这些吗？

score 0 · Accepted Answer

是的，JQuery 实际上利用了CSS 1-3 选择器。

要选择具有特定属性值子字符串的元素，请使用[attr*=value]：

$('[jk_template*="red"]').css('color', 'red');

要选择没有特定属性的元素，请使用:not选择器：

$(':not([jk_template])').css('color','orange');

1 回答 1