본문 바로가기
JavaScript 시리즈☕

🚀querySelector 와 Event click 에 대해서🚀 | JavaScript시리즈 012

by @ENFJ 2021. 8. 6.

 

 getElementsByClassName() : 많은 element를 가져올때 씀(array를 반환)

- getElementsByTagName() : name을 할당할 수 있음(array를 반환)

- querySelector : element를 CSS selector방식으로 검색할 수 있음 (ex. h1:first-child)단 하나의 element를 return해줌⇒ hello란 class 내부에 있는 h1을 가지고 올 수 있다(id도 가능함)- 첫번째 element만 가져옴- 조건에 맞는

세개 다 가져오고 싶으면 querySelectorAll⇒ 세개의 h1이 들어있는 array를 가져다 줌
- querySelector("#hello); 와 getElementById("hello"); 는 같은 일을 하는 것임하지만 후자는 하위요소 가져오는 것을 못하므로 전자만 쓸거다

 

element를 가지고 오는 가장 멋진 방법은 querySelector 와 querySelectorAll

querySelector는 element를 css방식으로 검색할 수 있음

querySelector 은 단 하나의 element를 return 해줌.

 

 

event 는 만약 내가 입력을 끝내거나, 내 이름을 적거나, enter를 누르는 것, 그런게 event임.

클릭하면 색깔이 검은색에서 파란색으로 변합니다.
클릭한 횟수도 저기 콘솔창에 5번 클릭했는 것을 알 수 있습니다. (um... 이 기능으로 조회수 를 측정하는건가?)