자바스크립트 - closest() 엘리먼트에 가장 가까운 조상 찾기

closest(position, text) 

현재 엘리멘트에서 가장 가까운 조상을 반환합니다.

만약 조상이 없다면 null값을 반환 합니다.

 

문법

const closestElement = element.closest(selectors);

파라미터

• 매개변수  (selector) : 찾고 싶은 조상의 CSS 선택자를 입력 하면 됩니다. ex) '.className' '#id' 등

결과값

• 가장 가까운 조상의 Element를 반환 없다면 null

예시

<div id = "hello">
  <div class ="hi">
    <div class ="me">
    </div>
  </div>
</div>

const me = document.querySelector('.me');

const hi = me.closest('.hi');
const hello = me.closest('#hello');

console.log(hi);
console.log(hello);

 

선택자 참고 

CSS 선택자/결합자 - 전체, 유형, id, class, 자식, 형제, 인접 형제