December 5, 2021

<input>과 같이 폼(form) 조작에 사용되는 요소에는 특별한 프로퍼티와 이벤트가 많습니다.

이 프로퍼티와 이벤트들을 익히고 나면 폼을 다루기가 훨씬 편리해질 겁니다.

document.forms.my - 이름이 'my'인 폼
document.forms[0] - 문서 내의 첫 번째 폼

폼 요소 탐색에 쓰이는 프로퍼티는 태그 구조에 의존하지 않습니다. 폼을 조작하는 데 쓰이는 요소들은 모두 태그 깊이에 상관없이 form.elements을 사용해 접근할 수 있습니다.

input과 textarea 요소의 값은 input.value (string) 또는 input.checked(boolean)을 사용해 얻을 수 있습니다.

이렇게 말이죠.

input.value = "New value";
textarea.value = "New text";

input.checked = true; // 체크박스나 라디오 버튼에서 쓸 수 있습니다.

select와 option

<select> 요소에는 세 가지 중요 프로퍼티가 있습니다.

  1. select.options – <option> 하위 요소를 담고 있는 컬렉션
  2. select.value – 현재 선택된 <option> 값
  3. select.selectedIndex – 현재 선택된 <option>의 번호(인덱스)

요약

폼 탐색하기