Как исключить из селектора * один элемент div со всеми его дочерними элементами? - PullRequest
0 голосов
/ 18 июня 2020

Я написал сценарий на jquery, который добавляет класс ко всем элементам на странице с помощью селектора * (all) . Я хотел бы исключить один элемент div со всеми его дочерними элементами. Мне интересно, как это сделать. Я попытался использовать псевдокласс : не , , включая упомянутый div , но я не знаю, как исключить и его детей. Может ли кто-нибудь из вас помочь мне решить эту проблему?

Код с псевдоклассом: not

$(document).ready(function(){
   $('#yellow-background').click(function(){
      $(':not(div[aria-label="Slajder"])').addClass("yellow-background");
});

Нормальный код:

$(document).ready(function(){
   $('#yellow-background').click(function(){
      $('*').addClass("yellow-background");
});

1 Ответ

1 голос
/ 18 июня 2020

ВСЕ элементы? Почему бы не сделать желтый оверлей и вместо этого показать div в середине ?

В любом случае

$("*:not('div[aria-label=Slajder] *')").addClass("yellow-background");

сложнее написать, чем

$('*').not('div[aria-label="Slajder"] *').addClass("yellow-background");

по кавычкам, но работают оба

$(function() {
  $('#yellow-background').click(function() {
    $('*').not('div[aria-label="Slajder"] *').addClass("yellow-background");
  });
});
.yellow-background {
  background-color: yellow
}
[aria-label=Slajder] { background-color: red }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button id="yellow-background">Yellow</button>

<div>Content
  <div>content
    <div aria-label="Slajder"><h1>Slajder </h1>
      <div>
        exluded content
          <div>more exluded content</div>
      </div>
    </div>
    more content
  </div>
</div>
...