정중식의 개발공부로그

javascript 이벤트 위임 핵심 코드 정리

26 Oct 2020 | css

들어가기에 앞서..

인프런 - 3D템플릿 만들기 인터랙티브 웹 강의에서나온 코드를 정리했습니다.

코드

  function getTarget(elem, className) {
    while (!elem.classList.contains(className)) {
      elem = elem.parentNode;

      if (elem.nodeName == 'BODY') {
        elem = null;
        return;
      }
    }
    return elem;
  }

//   Ex
let pageElem = getTarget(e.target, 'page');

getTarget 함수 정리

  • 요소를 눌렀을때 ‘page’요소의 하위 요소를 클릭했다면(e.target)
    그 요소의 부모를 할당을 해주는것이다.(elem = elem.parentNode;)
    그러면 ‘page’ 요소가 할당이 된다.

Related Posts