부모요소.querySelector('자식 태그||클래스||아이디')
localStorage.setItem("history", JSON.stringify(removedHistory));
const initialHistory = JSON.parse(localStorage.getItem("history"));
innerHTML의 경우 this.$target.innerHTML = ` <div class="form-control"> <label for="text">Text</label>
<input type="text" id="text" placeholder="Enter text..." />
</div>
<div class="form-control">
<label for="amount"
>Amount <br />
(negative - expense, positive - income)</label
>
<input type="number" id="amount" placeholder="Enter amount..." />
</div>
<button class="btn">Add transaction</button>`;
다음과 같이 코딩하고, 이벤트를 this.$target에 걸어 e.target.firstChild로 조회하면

빈 문자열 text노드가 노출된다.
innerHTML로 깡코딩하면 공백문자도 자식이되어버림. innerHTML로 코딩하는 경우 자식을
const inputs = target.querySelectorAll("input");
const textValue = inputs[0].value;
const amountValue = inputs[1].value;
다음과 같이 태그명, 클래스명, 아이디명을 명시해서 받아오면된다.
appendChild는 firstChild, lastChild등이 제대로 동작한다.