querySelector() , querySelectorAll()
: HTML 노드 (관리객체)로 리턴하는 메서드
getElement**() : HTML Collection으로 리턴
- name, id 속성으로 접근 가능
- 속성 접근시 더 유용, 더 빠르고 많은 지원 받기 가능
element = document.getElementById(id);
id를 통해 엘리먼트를 반환한다. 만약 document에 구체적인 ID의 엘리먼트가 없다면 null을 반환한다.
querySelector() , querySelectorAll() : NodeList 형태로 리턴
- 배열, classList 등 여러개의 값 가져오기 사용시 많이 사용
- index번호처럼 [0] 번지로 접근 가능
- 더 구체적인 엘리먼트를 선택하고 싶은 경우
1. querySelector()
element = document.querySelector(selectors);
selector의 구체적인 그룹과 일치하는 document안 첫번째 엘리먼트를 반환한다. 일치하는게 없으면 null반환한다.
- 단일 노드 리턴
2. querySelectorAll()
element = document.querySelectorAll(selectors);
여러 엘리먼트를 같이 반환
- 노드 리스트 형태로 리턴
'HTML.CSS.JS > JS' 카테고리의 다른 글
[JS] 할인율 구하기 (0) | 2023.04.24 |
---|---|
[JS] 클릭하면 출력onclick, addEventListener (0) | 2023.04.24 |
[JS] 여행 준비물 점검 목록 (버튼으로 추가, 삭제하기) (0) | 2023.04.21 |
[JS] history 객체 (0) | 2023.04.21 |
[JS] DOM ( Document Object Model ) : 문서(html) 객체 모델 (0) | 2023.04.21 |