인프런 커뮤니티 질문&답변
작성한 질문수
질문드립니다.
작성
·
165
0
뷰강의를 듣고 자바스크립트도 듣고 싶어서 강의를 듣는중인데요,
DOM 에서 HTML추가요소제거 강의에서
"앞에추가"버튼을 클릭해서 추가될때 뒤에 추가되는것처럼 X을 나오게 하려면 어떻게 해야 하나요?
예제는 뒤에 추가하는것만 x버튼이 나오는데...
뒤에 추가하는것처럼 하려고 헀더니 에러가 나서 아무래도 제가 잘 못한거 같아서요
답변 1
0
짐코딩
지식공유자
안녕하새요 :)
"뒤에추가" 버튼 클릭시 로직과 동일 합니다.
아래 코드 보시면 이해가 되실 거에요
// 앞에추가 버튼 클릭시 이벤트
addBeforeBtn.addEventListener('click', function () {
let li = document.createElement('li');
let ul = document.querySelector('ul');
let targetLi = document.querySelector('li#target');
console.log(targetLi);
li.textContent = inputBox.value;
// "X" 버튼 추가 코드 (5줄)
let button = document.createElement('button');
button.textContent = 'X';
button.classList.add('remove-btn');
button.addEventListener('click', removeParentNode);
li.appendChild(button);
// ul.appendChild(li);
ul.insertBefore(li, targetLi);
});