javascript document.crateElement&appendChild

뉴비·2024년 10월 18일

자바 스크립트

목록 보기
9/20

document.crateElement()

메소드는 지정된 이름의 HTML 요소를 만들어 반환한다.
즉, 내가 작성한 HTML에 존재하지 않는 태그를 뒤늦게 만들어서 추가할 수 있게 도와주는 메소드이다.

document.crateElement('div')
document.crateElement('p')
document.crateElement('a')

crateElement는 만드는 역할만 할뿐이지 웹 브라우저 화면에 추가되는 것은 아니다!

appendChild()

appendChild 메소드는 DOM 내 개별요소에 자식 요소를 추가할 때 사용하는 메소드이다.

기본적으로
target,appendChild(자식으로 추가할 요소)
예시
const p = document.crateElement("p")
document.body.appendChild(p)

append()

타겟 요소에 자식 요소를 추가한다는 점에서 같으나, 차이점도 존재한다.

  • append(내용만 가지고도 추가 가능)를 이용하면 요소에 노드 객체 또는 문자열을 자식 요소로 추가할 수 있지만, appendChild는 노드 객체(html 요소만 추가 가능)만을 추가할 수 있다.
  • append child의 경우 추가한 자식 노드를 반환하지만, append는 반환 데이터가 없다.
profile
뉴비입니다

0개의 댓글