append()와 appendChild()
append()와 appendChild()의 차이에 대해 알아보자.
공통점
부모 자식에 자식 노드를 추가하는 메서드이다.
차이점
자식 노드를 추가하는 방식이 다르다.
append()
Node 객체로 자식 요소를 설정할 수 있을 뿐만 아니라, text를 사용할 수도 있다.
return 값을 반환하지 않는다.
const div = document.createElement('div');
div.append('hello');
// 결과 : <div>hello</div>또한 여러 개의 자식 요소를 추가할 수 있다.
const div = document.createElement('div')
const p = document.createElement('p')
document.body.append(div, p, 'hello')
//결과 : <body><div></div> <p></p> hello</body>appendChild()
오로지 node객체만 자식 요소로 추가할 수 있다.
return 값을 반환한다.
const div = document.createElement('div')
const p = document.createElemment('p')
div.appendChild(p)
// 결과 : <div><p></p></div>
내가 나에게 알려주는 개발 공부