как работают: не селектор

Я хочу выбрать только кнопки без определенного data-filter-group. В этом случае, когда значение data-filter-group не равно «жанрам».как работают: не селектор

Как выбрать только эти кнопки?

Код отлично работает без переключателя :not(), поэтому я не понимаю, как он работает.

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> 
 
<script> 
 
$(document).ready(function(){ 
 
    $("#filters:not([data-filter-group='genres']) button").css("background-color", "yellow"); 
 
}); 
 
</script> 
 
</head> 
 
<body> 
 

 
<div id="filters"> 
 
    <div class="ui-group"> 
 
     <h3>Genere</h3> 
 
     <div id="genres" class="button-group js-radio-button-group" data-filter-group="genres"> 
 
      <button class="button is-checked" data-filter="">All<span></span></button> 
 
      <button class="button" data-filter=".Action">Action<span></span></button> 
 
      <button class="button" data-filter=".Adventure">Adventure<span></span></button> 
 
      <button class="button" data-filter=".Animation">Animation<span></span></button> 
 
      <button class="button" data-filter=".Comedy">Comedy<span></span></button> 
 
      <button class="button" data-filter=".Crime">Crime<span></span></button> 
 
      <button class="button" data-filter=".Drama">Drama<span></span></button> 
 
      <button class="button" data-filter=".Family">Family<span></span></button> 
 
      <button class="button" data-filter=".Fantasy">Fantasy<span></span></button> 
 
      <button class="button" data-filter=".Romance">Romance<span></span></button> 
 
      <button class="button" data-filter=".ScienceFiction">Science Fiction<span></span></button> 
 
      <button class="button" data-filter=".Thriller">Thriller<span></span></button> 
 
     </div> 
 
    </div> 
 
    <br /> 
 
    <div class="ui-group"> 
 
     <h3>Registi</h3> 
 
     <div id="directors" class="button-group js-radio-button-group" data-filter-group="directors"> 
 
      <button class="button is-checked" data-filter="">All<span></span></button> 
 
     </div> 
 
    </div> 
 
    <div class="ui-group"> 
 
     <h3>Attori</h3> 
 
     <div id="actors" class="button-group js-radio-button-group" data-filter-group="actors"> 
 
      <button class="button is-checked" data-filter="">All<span></span></button> 
 
     </div> 
 
    </div> 
 
</div> 
 

 
</body> 
 
</html>

источник

2016-02-03 mc2nzo137

'$ (" # фильтры: нет ([данные фильтр-группа = 'жанры' ])> кнопка ")' –

Это может быть достигнуто 2 способами

$("div[data-filter-group!='genres'] > button ").css("background-color", "yellow"); 

or 

$(":not([data-filter-group='genres']) > button").css("background-color", "yellow");

https://jsfiddle.net/vxtochsu/

источник

2016-02-03 15:07:05 Thangaraja

ответ

Смежные вопросы