Hello - You Don't Need jQuery - 목차 - Query Selector

15216845d08-054fbbe5.md

Hello

You Don't Need jQuery

오늘날 프론트엔드 개발 환경은 급격히 진화하고 있고, 모던 브라우저들은 이미 충분히 많은 DOM/BOM API들을 구현했습니다. 우리는 jQuery를 DOM 처리나 이벤트를 위해 처음부터 배울 필요가 없습니다. React, Angular, Vue같은 프론트엔드 라이브러리들이 주도권을 차지하는 동안 DOM을 바로 처리하는 것은 안티패턴이 되었고, jQuery의 중요성은 줄어들었습니다. 이 프로젝트는 대부분의 jQuery 메소드의 대안을 IE 10+ 이상을 지원하는 네이티브 구현으로 소개합니다.

목차

1. Query Selector
2. CSS & Style
3. DOM 조작
4. Ajax
5. 이벤트
6. 유틸리티
7. 대안방법
8. 번역
9. 브라우저 지원

Query Selector

평범한 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로 찾기

note-info.json

{"noteId":"15216845d08-054fbbe5","main":"15216845d08-054fbbe5.md","title":"Hello - You Don't Need jQuery - 목차 - Query Selector"}