[노마드코더] 바닐라 JS로 크롬앱 만들기 3일차(getElementById, querySelector)

 

 

 

css와 같이 자바스크립트에서도 element를 선택할 수 있다.

 

javascript 에서 id로 무언가 선택할 때는 document.getElementById 라고 쓴다.

 

 

 

 

1. id 속성을 가진 요소를 찾아 객체 반환하기
const title = document.getElementById("title");

2. 내용수정
title.innerHTML = "Hi! From JS"

3.색상변경
title.style.color = "red"

4. 타이틀 변경
document.title = 'I own you now'

 

 

 

js로 객체화 하는 것을 통해 각종 html 문서를 감지하고 추가하고 변경하는 등의 것들을 할 수 있다.

 

 

 

 

document.queryselector()

queryselector는 노드의 첫번째 자식을 반환.
특정 name이나 id를 제한하지 않고 css선택자를 사용하여 요소를 찾을 수 있다.

객체를
id로 찾고싶다면 "#title"
class로 찾고 싶다면 ".title"

 

 

---