[JavaScript - 10] createElement, appendChild

createElement, appendChild

createElement

• document.createElement() 메서드는 지정된 이름의 HTML 요소를 만들어 반환

document.createElement('div')

• HTML요소가 만들어 지고 반환되었다고 해서 요소가 곧장 브라우저에 추가되는 것이 아님
• 자바스크립트 단계에서 만들어져 있는 요소를 화면에 표시하는 작업으로 추가해줘야 함

appendChild

• appendChild메서드는 DOM 내 개별 요소(’노드’)에 자식 요소를 추가할때 사용하는 메소드

• 사용방법

  target.appendChild(자식으로 추가할 요소)
  
  예제
  const p = document.createElement('p')
  document.body.appendChild(p)

• appendchild와 비슷한 역할을 하는 append매소드도 있다
  • appendchild와 append메서드의 차이
    • append를 이용하면 요소에 노드객체 또는 문자열을 자식요소로 추가할 수 있지만, appendChild는 노드 객체만 추가할 수 있음
    • appendChild의 경우 추가한 자식 노드를 반환하지만, append는 반환 데이터가 없음