選擇具有某個類而不是其他類的元素

使用javascript，我期待選擇div作爲類成員的元素，而不是其他類的成員。在下面的示例中，我想選擇屬於b類的div元素，而不是a類中的元素。這應該導致只有4被選中，因爲3是類a的一部分。選擇具有某個類而不是其他類的元素

<body> 
    <div>1<div> 
    <div class="a">2</div> 
    <div class="a b">3</div> 
    <div class="b">4</div> 
</body>

來源

2017-03-01 Cameron Aziz

$（「B：沒有（.a）中」） –

您可以通過查詢選擇器中選擇它們，:not

console.log(document.querySelectorAll("div.b:not(.a)"))

<div class="a">2</div> 
 
    <div class="a b">3</div> 
 
    <div class="b">4</div>

來源

2017-03-01 00:47:33 baao

-1

var has_a = Array.from(document.getElementsByClassName("a")); 
var has_b = has_a.filter(e=>!e.classList.contains('b')); 

// replace the arrow notation with a lambda if you can't use it

has_b現在是含有a類元素的數組，但不是類b。

如果您不能使用Array.from，用循環替換：

var has_a = document.getElementsByClassName("a"); 
var has_b = []; 
for (var i=0; i<has_a.length; ++i) { 
    if (!has_a[i].classList.contains('b')) 
     has_b.push(has[i]);

來源

2017-03-01 00:46:26 pyrocrasty

var matches = document.querySelectorAll('.b:not(.a)'); 
 
console.log(matches);

<div>1<div> 
 
<div class="a">2</div> 
 
<div class="a b">3</div> 
 
<div class="b">4</div>

結果是div.b其中包含數字4，（節點列表）這適用於所有元素不僅適用於div。如果你只是想的div內工作的選擇只是改變div.b:not(.a)

https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelectorAll

來源

2017-03-01 01:17:56

這個工作，但只需要選擇只有'div'以及。 –

選擇具有某個類而不是其他類的元素

回答

相關問題