7

我正在尝试对确切的类名进行 css 选择器查询。

考虑这个 html

<div class="My class1">Some long text</div>
<div class="My class1 234">Some long text2</div>
<div class="My class1">Some long text3</div>
<div class="My class1 haha">Some long text2</div>

现在我只想抓住班级'My class1' ...并忽略'My class1 234'或'My class1 haha​​'..

查询 $$('div.My class1') 给了我上面的所有 4 个。注意:我正在尝试使用萤火虫控制台..

如何在此处指定确切的类名以便仅获取该特定类?

谢谢

4

3 回答 3

13

jQuery 等于选择器:http ://api.jquery.com/attribute-equals-selector/

jQuery("[class='My class1']").

或者

$("[class='My class1']").

或者

$$("[class='My class1']").
于 2013-06-26T07:35:50.973 回答
5

元素中的类定义由空格分隔,因此您的第一个元素实际上同时具有类“My”和“class1”。

如果您使用的是 Mootools,则可以使用以下内容:

$$("div.My.class1:not(div.234):not(div.haha)")

Mootools 中的示例:http: //jsfiddle.net/vVZt8/2/

参考:http ://mootools.net/docs/core125/core/Utilities/Selectors#Selector:not

如果您使用的是 jQuery,则可以使用以下内容:

$("div.My.class1").not("div.234").not("div.haha");

jQuery 中的示例:http: //jsfiddle.net/vVZt8/3/

参考:http ://api.jquery.com/not-selector/

这两个示例基本上检索具有类“My”和“class1”的所有元素,然后删除任何属于“div”元素的元素,这些元素具有分配给它们的“234”或“haha”类。

于 2013-06-26T07:36:47.647 回答
5

属性选择器语法

对于直接的 CSS,它是:

[class='My class1']

对于大多数 javascript 框架,如 jQuery、MooTools 等,它将使用与直接 CSS 相同的选择器字符串。

关键是使用属性选择器来做,而不是直接通过类名本身来选择。(class=只有等号)只会选择与后面的字符串完全匹配。如果您还需要捕捉,class1 My那么您也需要选择 for [class='class1 My']。这将涵盖仅应用这两个类的两种情况(无论 html 中的顺序如何)。

于 2013-06-26T15:23:48.943 回答