Language/JavaScript
Day20 : querySelector() / defer
Anoi
2023. 12. 4. 01:03
querySelector()
querySelector는 특정 name 이나 id 를 제한하지않고 css선택자를 사용하여 요소를 찾는다
(#tag의 아이디) -> 해당 아이디를 가진tag를 찾습니다
(.tag의 클래스) -> 해당 클래스명을 가진 tag를 찾는다
- 반환객체는 한개의 요소만 찾을 수 있다.
- 동일한 클래스명 을 가진 객체가 있다면 html문서내의 첫번째를 나타나는 요소를 반환
textContent
해당 태그의 내부에 직접 텍스트를 추가해줄 수 있는 속성
index.html의 <head>
index.html의 <div>
script.js의 시작코드
querySelector()를 이용해 호출할 태그를 선택한다.
만일 defer가 없었다면
html이 파싱되다 말고 script로 넘어와서 d-day-message 태그가 생성되지 않은 채로 호출하게 돼 오류가 발생할 것이다
d-day-message 태그에는 아무런 내용도 없지만 textContent 속성으로 텍스트를 추가해주었다.
화면에 출력 성공
Parsing과 defer