본문 바로가기

insertBefore2

[ JavaScript ] insertBefore()보다 더 편리하게 쓸 수 있는 insertAdjacentElement(), 특정 위치에 요소 추가하기 insertAdjacentElement() DOM요소에 새로운 요소를 특정 위치에 추가하는 기능을 제공하는 메서드. ( * 'adjacent: 인접한'이란 뜻으로 아마 인접한 위치에 요소를 추가하기에 ) element.insertAdjacentElement(position, newElement); element 기준이 되는 요소 position 새로운 요소를 추가할 위치를 지정하는 문자열 - beforebegin 요소 바로 앞에 추가 - afterbegin 요소의 첫 번째 자식으로 추가 - beforeend 요소의 마지막 자식으로 추가 - afterend 요소의 바로 뒤에 추가 newElement 추가할 새로운 DOM 요소 insertAdjacentElement()는 전에 많이 사용했던 insertBef.. 2023. 8. 4.
[ JavaScript ] insertBefore()로 원하는 요소 앞에 요소를 추가하기 insertBefore() 자바스크립트에서 DOM을 조작하는 메서드 중 하나로 특정 요소를 다른 요소 앞에 삽입할 수 있는 코드. parentNode.insertBefore(newNode, referenceNode); parentNode 요소를 추가할 부모 노드 newNode 새롭게 추가하고 싶은 노드 referenceNode newNode를 넣을 위치를 기준으로 할 때 해당 위치의 요소 HTML 코드 item1 item3 JS 코드 //부모 노드 가져오기 const itemList = document.getElementById('itemList'); //새로운 리스트 아이템 만들기 const newItem = document.createElement('li'); newItem.textContent = .. 2023. 8. 4.