Achievement Goals
document.createElement('div')
새롭게 생성한 div element는 어떻게 활용할 수 있나요?
const tweetDiv = document.createElement('div')
tweetDiv 라는 요소는 현재 공중부양 중입니다. APPEND 를 이용해 실제 웹 페이지 상에도 보이는 것을 확인할 수 있습니다.
document.body.append(tweetDiv)
const oneTweet = document.querySelector('.tweet')
HTML 문서에는 클래스 이름이 tweet 인 엘리먼트가 여러 개 있는 데, 변수 oneTweet 에 할당된 엘리먼트는 단 하나입니다.
여러 개의 엘리먼트를 한 번에 가져오기 위해서는, querySelectorAll 을 사용합니다.
const tweets = document.querySelectorAll('.tweet')
const getOneTweet = document.getElementById('container')
const queryOneTweet = document.querySelector('#container')
console.log(getOneTweet === queryOneTweet) // true
const container = document.querySelector('#container')
const tweetDiv = document.createElement('div')
container.append(tweetDiv)
MDN에서 querySelector를 검색하여, 다음의 질문에 대해 학습합니다.
querySelector의 첫번째 인자에 'div'를 넣으면 어떻게 될까요?
querySelector를 통해서 더 복잡한 작업을 할 수 있을까요?
querySelector의 부모는 꼭 document 객체여야만 할까요?
참고: 코드스테이츠