200918 TIL DOM 수정하기

journey·2020년 9월 18일
0

Document Object Model
한 마디로, 문서를 객체처럼 모델화한 것이다.

HTML의 Elements가 각각 Object로 저장이 된다.
JavaScript에 의해 저장된 Elements는 수정, 삭제가 가능하고 새로운 Elements를 추가하는 것 또한 가능하다.

  1. Elements의 content를 수정하기
    document.getElementById('oasis').innerHTML = ''
    생각해보기
  2. p tag에만 id 값을 준 경우
<h2>고르곤졸라</h2>
<p id='oasis'>브리</p>
<script>
  document.getElementById('oasis').innerHTML = 'hahahaha'
</script>
  1. h2 tag에만 id 값을 준 경우
<h2 id='oasis'>고르곤졸라</h2>
<p>브리</p>
<script>
  document.getElementById('oasis').innerHTML = 'hahahaha'
</script>
  1. h2, p tag 모두에 동일한 id 값을 준 경우
<h2 id='oasis'>고르곤졸라</h2>
<p id='oasis'>브리</p>
<script>
  document.getElementById('oasis').innerHTML = 'hahahaha'
</script>
profile
J for Journey

0개의 댓글