[바닐라 JS] DAY 6

오늘은 6일차 바닐라JS 

사실 어제 연말파티하느라 늦게해서 한번에 이틀치 정리했지만, 오늘은 기존까지 했던 내용 문제풀이기 때문에 

Not problem~~~~

 

Q1. JS에서 HTML에서 요소를 얻을 수 있는가? (해석 잘못했었도..ㅎ)

YES

 

Q2. JS로 부터 HTML 접근을 가능하게 해주는 요소가 무엇일까요?

elements -> document

 

Q3. 어떻게 JS에서 #title을 찾을 수 있을까요

음.. 솔직히 헷갈렸다 #title이라 그래서,,,뭘까,,

document.getElementsById("title");

 

Q4. JS에서 모든 .button을 어떻게 찾을 수 있을까요음.. 모든 버튼 !

document.getElementsById(".button");

 

Q5. <a>를 어떻게 찾을 수 있을까요..

모르는게 나왔다..! 하지만 보기를 보고 알 수 있었던..

document.getElementsByTagName("a");

 

Q6. 어떻게 모든 .home h1:first-child를 찾을 수 있을까요 ?

document.querySelectorAll(".home h1:first-child")

 

Q7. 어떻게 첫번째 .home h1:first-child를 찾을 수 있을까요 ?

document.querySelector(".home h1:first-child")

 

Q8. JS로 부터 CSS의 요소들을 바꿀 수 있는가?

YES

 

Q9. btn.addEventListener("click", handler())가 작동할까요?

YES -> NO 

 

Q10. btn.addEventListener("click", handler)가 작동할까요?

NO ->YES

 

Q11. document와 window는 같니?

No. window는 브라우저의 창이고 document는 브라우저 창의 HTML 문서 객체이다.

즉, window객체 안에 document객체가 존재한다.

 

Q12. className과 ClassList의 차이점은 ?

ClassList는 모든 Class를 대체할 수 있지만, className은 그렇지않다.(반대다.)

 

Q13. classList.toggle은 무슨 역할이니~클래스가 존재하지 않을 경우 추가해주고, 이미 존재하는 클래스를 제거해주는 것이 toggle의 역할로, if else 대신 한줄로 간단하게 클리어가 가능했었다 !