>  기사  >  웹 프론트엔드  >  Jquery에서 div를 제외하는 방법

Jquery에서 div를 제외하는 방법

PHPz
PHPz원래의
2023-04-26 10:21:29560검색

jQuery를 사용하여 HTML 페이지를 조작할 때 특정 요소를 제외해야 하는 상황이 자주 발생합니다. 요소를 제외하는 방법에는 여러 가지가 있습니다. 이 기사에서는 jQuery를 사용하여 div 요소를 제외하는 방법을 예제를 통해 소개합니다.

1. 기본 구문

jQuery에서는 not() 메서드를 사용하여 특정 요소를 제외할 수 있습니다. not() 메소드는 일치하는 요소 집합에서 불필요한 요소를 제외하기 위해 선택기를 매개 변수로 받을 수 있습니다.

기본 구문은 다음과 같습니다.

$(selector).not(selector)

그 중 첫 번째 선택자 매개변수는 연산을 수행할 요소의 선택자이고, 두 번째 선택자 매개변수는 제외할 요소의 선택자입니다.

2. 단일 div 요소 제외

먼저 간단한 예를 살펴보겠습니다. 다음과 같은 HTML 코드가 있다고 가정해 보겠습니다.

<div class="wrapper">
  <div class="box">Box 1</div>
  <div class="box">Box 2</div>
  <div class="box">Box 3</div>
  <div class="box excluded">Box 4</div>
  <div class="box">Box 5</div>
</div>

이제 "excluded" 클래스가 있는 div 요소 중 하나를 제외하고 다른 요소에서만 작동해야 합니다. 다음 코드를 사용할 수 있습니다.

$('.box').not('.excluded').css('background-color', 'gray')

위 코드에서 먼저 선택기 ".box"를 사용하여 "box" 클래스가 있는 모든 div 요소를 선택한 다음 not() 메서드를 사용하여 클래스가 "excluded"인 div 요소를 제외합니다. ". 마지막으로 css() 메서드를 사용하여 이러한 요소의 배경색을 회색으로 설정합니다.

3. 여러 div 요소 제외

단일 div 요소를 제외하는 것 외에도 여러 요소를 제외할 수도 있습니다. 다음 HTML 코드를 고려해보세요.

<div class="wrapper">
  <div class="box">Box 1</div>
  <div class="box">Box 2</div>
  <div class="box">Box 3</div>
  <div class="box excluded">Box 4</div>
  <div class="box">Box 5</div>
  <hr>
  <div class="panel">Panel 1</div>
  <div class="panel">Panel 2</div>
  <div class="panel">Panel 3</div>
  <div class="panel excluded">Panel 4</div>
  <div class="panel">Panel 5</div>
</div>

이제 div든 다른 요소든 "excluded" 클래스가 있는 모든 요소를 ​​제외해야 합니다. 다음 코드를 사용할 수 있습니다.

$('*').not('.excluded').css('color', 'red')

위 코드에서 와일드카드 "*"를 사용하여 모든 요소를 ​​선택한 다음 not() 메서드를 사용하여 "excluded" 클래스가 있는 요소를 제외하고 마지막으로 css() 메서드를 사용합니다. 이러한 요소의 텍스트 색상을 빨간색으로 설정합니다. 와일드카드를 사용하면 페이지의 모든 요소에 작동하므로 꼭 필요한 경우에만 사용하세요.

4. 요약

이 글에서는 jQuery에서 div 요소를 제외하는 방법을 소개합니다. not() 메서드를 사용하면 일치하는 요소 집합에서 불필요한 요소를 제외하여 필요한 요소에 대한 작업을 수행할 수 있습니다. 제외된 규칙은 하나 이상의 요소에 대한 선택기일 수도 있고 와일드카드일 수도 있다는 점에 유의해야 합니다. 실제 사용에서는 불필요한 효과를 피하기 위해 특정 상황에 따라 적절한 방법을 선택해야 합니다.

위 내용은 Jquery에서 div를 제외하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.