회고: Dom

const oneDiv = document.createElement('div');       ----> <div></div>

oneDiv.textContent = 'dev';                                         ----> <div>dev</div>

oneDiv.classList.add('tweet')                                      ---->  <div class="tweet">dev</div>

const container = document.querySelector('#container')   

container.append(oneDiv)                                           ---->  아이디가 컨테이너인 요소의 자식으로 담는다

oneDiv.remove()                                                            ---> append 했던 요소를 삭제할 수 있다.

 

 

document.querySelector('#container').innerHTML = '';

--->컨테이너의 모든 자식요소 지우기       그렇지만 innerHTML 보안문제 있음 아래처럼 사용

 

const container = document.querySelector('#container');
while (container.firstChild) {
  container.removeChild(container.firstChild);
}

container의 첫 번째 자식 요소가 존재하면, 첫 번째 자식 요소를 제거합니다.  =>결론적으로 다 삭제

const tweets = document.querySelectorAll('.tweet')
tweets.forEach(function(tweet){
    tweet.remove();
})
// or
for (let tweet of tweets){
    tweet.remove()
}