jQuery 순회 - not() 메서드

jQuery 순회 참조 가이드

예제

id가 "selected"인 모든 요소를 포함한 집합에서 제거합니다：

$("p").not("#selected")

본인이 직접 시도해 보세요

정의와 사용법

not() 원소 집합에서 요소를 제거합니다.

문법 1

.not(selector)
매개변수 설명
selector 문자열 값, 요소를 매칭하는 선택자 표현식을 포함합니다.

문법 2

.not(element)
매개변수 설명
element 매칭 집합에서 제거해야 하는 하나나 여러 개의 DOM 요소.

문법 3

.not(function(index))
매개변수 설명
function(index) 집합 내 각 요소를 검사하는 함수. this는 현재 DOM 요소입니다.

상세 설명

주어진 jQuery 객체가 DOM 요소 집합을 나타내는 경우, .not() 메서드는 일치하는 요소의 하위 집합으로 새 jQuery 객체를 생성합니다. 적용된 선택자는 각 요소를 검사합니다; 선택자와 일치하지 않는 요소는 결과에 포함됩니다.

다음과 같은 간단한 목록을 가진 페이지를 생각해 보세요:

<ul>
  <li>목록 항목 1</li>
  <li>목록 항목 2</li>
  <li>목록 항목 3</li>
  <li>목록 항목 4</li>
  <li>목록 항목 5</li>
</ul>

이 메서드를 목록 항목 집합에 적용할 수 있습니다:

$('li').not(':even').css('background-color', 'red');

본인이 직접 시도해 보세요

이 호출의 결과는 2 번째와 4 번째 항목의 배경색을 빨간색으로 설정합니다. 이는 이들 항목이 선택자와 일치하지 않기 때문입니다(기억해 주세요, :even과 :odd는 0 기반 인덱스를 사용합니다).

정적 요소 제거

.not() 메서드의 두 번째 버전은 이미 다른 방법으로 요소를 찾았을 때 이를 필터 세트에서 제거할 수 있게 합니다. 예를 들어, 목록이 이미 하나의 id를 하나의 항목에 적용한 경우를 생각해 보세요:

<ul>
  <li>목록 항목 1</li>
  <li>목록 항목 2</li>
  <li id="notli">목록 항목 3</li>
  <li>목록 항목 4</li>
  <li>목록 항목 5</li>
</ul>

저자는 원시 JavaScript 함수 getElementById()를 사용하여 세 번째 목록 항목을 읽고 jQuery 객체에서 그것을 제거할 수 있습니다:

$('li').not(document.getElementById('notli')).css('background-color', 'red');

본인이 직접 시도해 보세요

이 문장은 1, 2, 3, 5 번째 항목의 배경색을 변경합니다. 우리는 더 간단한 jQuery 표현식으로 동일한 작업을 수행할 수 있지만, 이 기술은 다른 라이브러리가 순수 DOM 노드에 대한 참조를 제공할 때 매우 유용합니다.

jQuery 1.4에서는 .not() 메서드가 함수를 파라미터로 사용할 수 있으며, .filter() 메서드와 같습니다. 함수가 true를 반환하는 요소는 필터 세트에서 제외됩니다; 모든 다른 요소는 포함됩니다.

jQuery 순회 참조 가이드