오늘날 프론트엔드 개발 환경은 급격히 진화하고 있고, 모던 브라우저들은 이미 충분히 많은 DOM/BOM API들을 구현했습니다. 우리는 jQuery를 DOM 처리나 이벤트를 위해 처음부터 배울 필요가 없습니다. React, Angular, Vue같은 프론트엔드 라이브러리들이 주도권을 차지하는 동안 DOM을 바로 처리하는 것은 안티패턴이 되었고, jQuery의 중요성은 줄어들었습니다. 이 프로젝트는 대부분의 jQuery 메소드의 대안을 IE 10+ 이상을 지원하는 네이티브 구현으로 소개합니다.
평범한 class, id, attribute같은 selecotor는 document.querySelector나 document.querySelectorAll으로 대체할 수 있습니다.
document.querySelector는 처음 매칭된 엘리먼트를 반환합니다.document.querySelectorAll는 모든 매칭된 엘리먼트를 NodeList로 반환합니다.[].slice.call을 사용해서 Array로 변환할 수 있습니다.- 만약 매칭된 엘리멘트가 없으면 jQuery는
[]를 반환하지만 DOM API는null을 반환합니다. Null Pointer Exception에 주의하세요.
안내:
document.querySelector와document.querySelectorAll는 꽤 느립니다,getElementById나document.getElementsByClassName,document.getElementsByTagName를 사용하면 퍼포먼스가 향상을 기대할 수 있습니다.
- 1.0 selector로 찾기