노마드코더_바닐라js 클론 코딩_#3.2

 

 

const title 에 뭔가를 할당했지만, 

그 값이 없기 때문에 null 이라고 뜨는 것

 

 

 

 

 

 

document.~~~ 로 할 수 있는게 많다.

그 중 .getElementsByClassName("클래스이름");

 

 

먼저 HTML에 이렇게 class 이름을 가진 애들을 넣어주고

 

hello 라는 이름을 가진 클래스들을 HTML에서 가져오는 const hellos를 만들었다.

그 다음 콘솔에서 hellos를 로그하니

 

 

이렇게 전부 떴다!

 

HTMLColloctions(5) <- 5개라는 뜻

이건 array다. []로 되어 있으니

 

그렇기 때문에 

hellos.~ 이런 형태로 뭔갈 가져올 수 없다. 

왜냐면 이건 많은 h1이 들어있는 array이기 때문. 

 

=> 많은 elemenets를 [] 로 가져와야 할 때 이 함수를 사용한다.

 

 

 

 

tagName으로 가져오기 

(h1이 TagName이로구나)

 

 

여전히 title.~ 를 할 수 없다. 

 

왜냐면 title이 titile object 자체가 아니고 array이기 때문.

 

 

 

 

 

원하는걸 잘 가져옴!

 

 

 

 

 

DOT + hello h1

 

 

*** querySelector 

div h1으로도 검색할 수 있다.

 

 

 

 

 

만약에 <div></div> 가 세번 반복되어 있다면?

우리는 지금 h1을 세개 가지고 있다.

 

 

 첫번째 것 하나만!!!

 

 

 

설명에도 써있음

 

 

 

 

다 가져오고 싶다면?

 

querySelectorAll

 

 

 

이제부터 query를 거의 사용할거임

 

class도 쿼리로 가져올 수 있다. 

#를 사용해 클래스 이름이란걸 알려주면 됨l

 

사실 상 같은 코드임

 

but

 

나도 해봄