강사님의 설명 중 확인되어야 할 부분이 있어 의견을 남깁니다.
//find()는 전체(혹은 기준 값 하위)에서만 검색을 하지만 filter()는 자기 자신의
//레벨에서 검색을 한다.
라고 설명 해주셨습니다만, 제가 예제를 통해 이해한 것은 아래와 같습니다.
- filter() 메서드
- filter() 메서드로 어떤 요소를 찾으려면 복수 개의 jQuery객체를 가진 객체에서 사용해야 한다.
예시:
ex09에서 <div id="samplePage"> ┬ div id="header"
├ div id="content"
└ div id="footer"
let $divGroup = $("div#samplePage div");
- filter() 메서드는 $()함수를 통해 얻은 jQuery객체 배열(유사 배열)의 원소들 중에서 원하는 것을 찾을 수 있다.
예시: $divGroup.filter("#header"); // → div id="header"를 찾는다.
- filter() 메서드는 $()함수를 통해 얻은 단일 jQuery객체에서 사용하면 형제 노드 중 검색조건에 맞는 노드가 있어도 객체가 반환되지 않는다.
예시:
let $divHeader = $("div#header");
$divHeader.filter("#content"); // div id="content"에 해당하는 객체를 얻을 수 없다.
- filter() 메서드는 대상이 되는 jQuery객체 배열(유사 배열)의 원소들의 자식 또는 자손 요소는 찾지 않는다.
- find() 메서드
- find() 메서드는 복수 개의 jQuery객체를 가진 jQuery배열(유사 배열)이나 단일 jQuery 객체에서 사용할 수 있다.
- find() 메서드는 자식, 자손 노드를 모두 탐색해 검색 조건에 맞는 노드를 반환한다.
위 메서드들의 성질을 볼 때
filter() 메서드는 어떤 노드를 찾기 보다는 복수 개의 결과에서 특정 요소를 선택하는 데 사용하는 것이 유용해 보입니다.
find() 메서드는 filter() 보다 '검색' 처럼 사용할 수 있습니다.
정정되어야 할 내용이 있으면 다른 학우님들께 의견 부탁드립니다.
감사합니다.