Day20 : querySelector() / defer
2023. 12. 4. 01:03ㆍLanguage/JavaScript
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
'Language > JavaScript' 카테고리의 다른 글
| Day23 : 반복문 (0) | 2023.12.24 |
|---|---|
| Day22 : JS로 HTML, CSS 조작 (0) | 2023.12.07 |
| Day19 : 조건에 따른 메시지 출력 (2) | 2023.12.04 |
| Day18 : 조건문과 논리연산자 (0) | 2023.12.03 |
| Day17 : 비교연산자, 배열과 객체의 비교 (0) | 2023.11.28 |