vanilla JS로 siblings 구현하기

jQuery의 메소드 중 하나인 siblings()는 선택한 자신 요소를 제외한 형제 요소들을 모두 고르는 메소드다. 이를 바닐라 자바스크립트로 구현하려면 filter() 를 사용해 비교적 간단하게 구현할 수 있다. 예제코드 HTML one two three jQuery $(".one").siblings(); JavaScript const siblings = (el) => [...el.parentElement.children].filter(node => node != el); const one = document.querySelector('.one'); console.log(siblings(one)); // 함수에 엘리먼트를 넣으면 그 엘리먼트의 형제 요소들을 배열로 반환한다. // > (2) [li.t..

2023.02.13

jQuery node(DOM) 선택자

jQuery와 DOM jQuery에서는 선택자 및 필터링 기반 트리탐색이 가능하다. 선택자 기반 트리 탐색 메서드 자식 children('선택자') 선택자에 해당하는 직계자식을 선택 find('선택자') 선택자에 해당하는 자식, 자손을 선택 선택자 생략 불가 부모 parent('선택자') 선택자에 해당하는 직계부모를 선택 parents('선택자') 선택자에 해당하는 부모, 조상을 선택 (body, html까지도..) 선택자 생략 하지말자 다음 next('선택자') 선택자에 해당하는 바로 다음 형제 요소 1개 를 선택 (친구) nextAll('선택자') 선택자에 해당하는 모든 다음 형제 요소를 선택 (친구) 이전 prev('선택자') 선택자에 해당하는 이전 형제 요소 1개 를 선택 (친구) prevAll(..

2021.12.08