getElementById vs querySelector 의 차이점 > 개발

• 목록

• 페이스북 공유
• 트위터 공유

# getElementById vs querySelector 의 차이점


1. getElementById, getElementsByClassName

- 속도 빠르다. querySelector 에 비해 1.2~1.3배

- id, class, tag, name 등등을 다 따로따로 사용해야 한다.
```
document.getElementById("id").innerHTML;
document.getElementsByClassName("class").innerHTML;
document.getElementsByName("name").innerHTML;
document.getElementsByTagName("tag").innerText;
```

- 여러개를 찾을 때는 getElementsBy*** 시리즈를 사용해야 한다.




2. querySelector, querySelectorAll

- 속도 비교적 느리다.

- querySelector 하나로 찾기가 가능하다.
```
document.querySelector("#id").innerHTML;
document.querySelector(".class").innerHTML;
document.querySelector("body").innerText;
document.querySelector('ul li.class').innerText;
```

- querySelector 는 선택한 요소 중 첫번째 요소 하나만 가져온다 !!!

- 여러개를 찾을 때는 querySelectorAll 을 사용한다.

추천0