HTML input value
속성은 text
, password
속성에서 초기 미리보기 글자를 설정합니다. button
, submit
속성의 버튼 이름을 지정합니다. checkbox
, radio
속성에서 서버에 텍스트를 전달할 때 사용됩니다.
HTML Value
HTML value
속성은 <input>
태그에서 보조적인 속성을 사용됩니다. 초깃값 설정, 버튼 텍스트 변경, 양식 제출 등에 사용됩니다.
초깃값 설정
value의 첫 번째 기능은 초깃값 설정입니다. text
나 password
태그 조합에서 초기 글자를 미리 입력해둘 수 있습니다.
<input type="text" value="아이디를 입력하세요.">
<input type="password" value="비밀번호를 입력하세요.">
value
속성의 단점은 초깃값을 사용자가 지우고 입력해야 한다는 점입니다. placeholder
속성을 사용하면 초깃값을 자동 삭제하도록 설정할 수 있습니다.
<form action="">
<input type="text" placeholder="아이디를 입력하세요.">
<br>
<input type="password" placeholder="비밀번호를 입력하세요.">
</form>
버튼 텍스트 변경
value
속성의 두 번째 기능은 버튼 종류의 <input>
속성의 텍스트를 변경하는 일입니다.
submit
, button
과 같은 제출 버튼이나 reset
과 같은 초기화 버튼에 이름을 줄 수 있습니다. 단 file
버튼의 경우 value
속성으로 변경할 수 없습니다.
<form action="">
<input type="submit" value="하하">
<br>
<input type="button" value="호호">
<br>
<input type="reset" value="ㅋㅋ">
<br>
<input type="file" value="변경 안됨"><!--file 속성은 변경이 안됩니다.-->
</form>
제출 용도
value
속성의 마지막 기능은 서버의 데이터 제출용입니다. 클라이언트 사이드에서는 보이지 않습니다.
checkbox
나 radio
같은 속성은 버튼 안에 텍스트가 없고, 버튼에 대한 설명은 <label>
태그로 작성합니다.
<form action="">
<label><input type="radio" value="red">apple</label>
<br>
<label><input type="checkbox" value="green">melon</label>
</form>
따라서 value
속성을 입력해도 텍스트가 적용되지 않습니다. 하지만 서버에서는 제출용으로 사용되므로 중요한 기능을 합니다.