Mam taką strukturę HTML
<div class="dv a">a</div>
<div class="dv a">a1</div>
<div class="dv b">b</div>
<div class="dv b">b1</div>
<div class="dv c">c</div>
<div class="dv c">c1</div>
<div class="dv d">d</div>
<div class="dv d">d1</div>
Jak mogę uzyskać, że wszystkie elementy zawierają klasy a lub b lub c
$(".dv").each(function(){}); /// ? how to get
I jak zdobyć wszystkie elementy nie zawierające klasy a lub b
$(".dv:not(.a|.b)").each(function() {}); // ?how to get
Odpowiedzi:
2 dla odpowiedzi № 1JQuery polega na tym, że może korzystać z twoich umiejętności obsługi CSS, pod warunkiem, że przeglądarka jest aktualna. Jeśli tak, to następujące selektory czystego CSS wykonają zadanie:
.dv.a, .dv.b, .dv.c { /* Matching Ones: */
}
.dv:not(.a):not(.b):not(.c) { /* Non Matching Ones: */
}
Zilustruje to następujący fragment kodu:
.dv.a, .dv.b, .dv.c {
color: red;
}
.dv:not(.a):not(.b):not(.c) {
border: thin solid green;
}
<div class="dv a">a</div>
<div class="dv a">a1</div>
<div class="dv b">b</div>
<div class="dv b">b1</div>
<div class="dv c">c</div>
<div class="dv c">c1</div>
<div class="dv d">d</div>
<div class="dv d">d1</div>
5 dla odpowiedzi nr 2
Aby wybrać za pomocą or
logika:
$( ".a, .b, .c" )
Aby wybrać za pomocą not
logika:
$( "div:not(.a, .b)" )
Aby wybrać wszystko .dv
lecz bez .d
:
$( ".dv:not(.d)" )
Oto fragment kodu, który zlicza wszystkie logiki z powyższymi selektorami:
var orCount = $( ".a, .b, .c" ).length;
var andCount = $( "div:not(.a, .b)" ).length;
var notdCount = $( ".dv:not(.d)" ).length;
console.log("or logic count = " + orCount);
console.log("and logic count = " + andCount);
console.log("not d logic count = " + notdCount);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="dv a">a</div>
<div class="dv a">a1</div>
<div class="dv b">b</div>
<div class="dv b">b1</div>
<div class="dv c">c</div>
<div class="dv c">c1</div>
<div class="dv d">d</div>
<div class="dv d">d1</div>