● 입력 태그의 값 가져와 변경하기

마지막으로 입력 태그의 값을 얻은 후 변경해 보겠습니다. 코드를 다음과 같이 바꿉니다.

<script>

const $input = document.querySelector('input');
console.log($input.value);

</script>

이 코드에서 $input은 input 태그를 선택하는 변수입니다. input 태그 내부의 값을 얻으려면 $input.value를 하면 됩니다. 여기서 왜 textContent를 안 쓰는지 궁금하다면 그 자체로 훌륭합니다. 배운 내용을 응용할 줄 안다는 뜻이니까요!

그림 4-17 value로 input 태그의 값 얻기