getElementById 와 querySelector 선택자의 차이점?
706
작성한 질문수 2
본 강의 영상 약 8분경 나오는 querySelector 선택자를 자습하는 겸 getElementById 선택자로 변경하는 와중에
의문점이 있어서 구글링을 어느정도 해 보았는데, getElementById 선택자가 querySelector 에 비해 속도가 빠르기 때문에
현업에서 자주 사용되고 querySelector의 사용을 지양해야한다는 취지의 글을 읽었습니다.
index6.html 파일의 선택자를 getElementById로 선택자를 변경하기위해서는 <div> tag에 id값을 할당하여야하는데
이러한 방법을 사용하는것이 권장되는것인지와 혹여나 할당하지 않고 Id 선택자를 사용할 수 있는것인지?
이와 관련해서 실제 현업자이신 강사님의 조언을 듣고싶습니다.
답변 1
1
일정 부분 맞습니다. getElementById 가 속도가 좀더 빨라서, querySelector 보다는 좀더 선호되기도 합니다. 다만, 그런 속도의 차이는 상당량의 JS 를 한 페이지에서 처리할때나 고려할 만한 부분이고요.
코드를 작성하는 부분에 있어서는 querySelector 가 좀더 다양한 CSS Selector 를 적용해서, 동일한 함수로 원하는 태그를 선택할 수 있는 장점은 있어요. (말씀하신대로, ID 가 없으면 getElementBy~~~~ 와 같이 각각의 함수를 써야 하니까요.)
그래서, 속도 차이가 있음을 이해하고, getElementById 등, CSS Selector 에 따라서, 관련 특정 CSS Selector 를 선택할 수 있는 함수를 우선 쓰시되, querySelector 의 사용법을 알고 계시면 어떠실까 합니다.
교육기간을 연장할 수 있는지 문의드립니다.
0
50
1
메일 확인부탁드립니다
0
69
1
CodeSandbox Vanilla 질문있습니다
0
69
1
part1을 수강하지 않아도 지장이 없다 하셨는데
0
118
1
강의에 관해 문의 드립니다.
0
105
1
메일확인 부탁드립니다.
0
96
1
14강 - 72,73번 강의 영상이 동일한거 같습니다.
0
118
1
Symbol 관련 테스트 코드 실행 결과 문의
0
153
1
호환성 관련 태그
0
125
1
강의화면은 index.js인데 왜 샌드박스코드에서는 index.mjs인지 궁금해요
0
153
1
강의화면은 index.js인데 왜 샌드박스코드에서는 index.mjs인지 궁금해요
0
150
1
div id="highlighter"가 강의화면에는 없는데 왜 샌드박스파일에는 있는지 궁금해요
0
93
1
강의화면에 height 가 vh가 아닌 vw라고 나와있는데 뭐가맞는거죠
0
126
1
메일 확인 부탁드립니다.
0
154
1
메일 확인 부탁드립니다
0
154
1
특별한 형태의 javascript배열에서
0
143
1
메일 확인부탁드립니다!
0
170
1
codesandbox 업데이트..
0
151
1
pdf 파일에 있는 링크주소로 들어가지지가 않습니다.
0
272
2
강의에서 알려주신 Properties for the flex container 복습 사이트, 검색 발견되어서 공유드립니다~
0
157
1
removeEventlistener 를 왜 해주어야 하는지
0
233
1
100vw 관련 질문
0
346
2
VS CODE html:5 <tab>기능이 안됩니다
0
359
1
[모던웹페이지 만들기9](1:40)class-desc 카드부분관련
0
256
2