DAY 3. Form 삽입에 관련된 tag(2): <input> tag

<input>	- 다양한 form에서 client가 입력한 정보를 받을 때. - 보통 속성 type를 사용해 입력하는 정보의 성격을 정함.
type="text"	- 한 줄짜리 text 입력하는 text box 삽입.      ex, 아이디, 이름, 주소 등 한 줄짜리 일반 text.
type="password"	- 비밀번호 입력하는 field 삽입. - *모양이나 ●모양으로 보이는 점 빼면 다른 성격은 type="text"와 똑같음.
size	- text나 password가 화면에 몇 글자가 보이게 할 건지 지정.
value	- text field 부분에 보여주는 내용. - 이거 안 쓰면 빈 text field가 보임. - password에서는 안 씀.
maxlength	- text나 password 최대 입력 가능한 문자 수(數) 지정.
type="search"	- 검색할 때 입력하는 field 삽입. - mobile web browser에서는 검색어 입력 시 X표시가 뜸.
type="url"	- URL 주소를 입력하는 field 삽입. - 입력값이 URL이 아니면 web browser가 오류 메세지를 보여줌.
type="email"	- 이메일 주소 입력하는 field 삽입. - 입력값이 이메일 주소가 아니면 web browser가 오류 메세지를 보여줌.
type="tel"	- 전화번호 입력하는 field 삽입. - 지역마다 전화번호 형식 달라서 입력값이 잘못된 값인지 체크 不可. - mobile 페이지에서는 바로 전화 걸 수 있음.
type="checkbox"	- 주어진 여러 항목에서 2개 이상 선택할 수 있는 check box 삽입.
type="radio"	- 주어진 여러 항목에서 1개만 선택할 수 있는 radio button 삽입.
value	- 선택한 checkbox나 radio button을 server에게 알려줄 때 넘겨줄 값 지정. - 필수로 써야하는 속성임. - English 또는 숫자만 가능.
checked	- checkbox나 radio button 中 default로 선택해 놓고 싶은 항목에 씀.
name	- radio button에 쓸 수 있는 속성. - web programming (ex, PHP)에서 form 요소 제어할 때 자주 씀. - name 속성 안 썼을 때처럼 radio button 하나만 누를 수 있게 하려면   모든 radio button에 적힌 name값이 똑같아야 함.
type="number"	- 숫자를 조절할 수 있는 spin box 삽입.
type="range"	- 숫자를 조절할 수 있는 slide rod 삽입.
min	- field에 입력할 수 있는 최솟값 지정. default는 0임.
max	- field에 입력할 수 있는 최댓값 지정. default는 100임.
step	- 숫자 간격 지정. default는 1임.
value	- field에 표시할 초깃값 지정.
type="date"	- client가 있는 지역 기준으로 날짜(연, 월, 일) 삽입. - 날짜 선택하면 field에 yyyy-mm-dd로 나타남.
type="month"	- client가 있는 지역 기준으로 날짜(연, 월) 삽입. - 월 선택하면 field에 yyyy-mm로 나타남.
type="week"	- client가 있는 지역 기준으로 날짜(연, 주) 삽입. - 주 선택하면 field에 1월 첫째주 기준으로 몇 번째 주인지 표시됨. (yyyy-nn번째 주)
type="time"	- client가 있는 지역 기준으로 시간(시, 분, 초, 분할 초) 삽입.
type="datetime"	- 국제 표준시(UTC)로 설정된 날짜&시간(연, 월, 일, 시, 분, 초, 분할 초) 삽입.
type="datetime-local"	- client가 있는 지역 기준으로 날짜&시간(연, 월, 일, 시, 분, 초, 분할 초) 삽입.
min, max	- 날짜, 시간 범위 제한할 때. - 원하는 범위 시작을 min값으로, 끝을 max값으로 지정.
step	- spin box 화살표 클릭하면 증감되는 크기 지정.
value	- default로 표시할 날짜 or 시간 지정.
type="submit"	- 전송 버튼 삽입. - form에 client가 입력한 정보를 server로 전송. - 정보는 <form action="~~"> 에서 ~~부분에 적힌 form 처리 프로그램으로 넘겨짐.
type="reset"	- reset 버튼 삽입. - <input>에 입력된 모든 정보를 재설정 = client가 쓴거 다 지워버림.
value	- submit과 reset 버튼에 표시할 내용 지정.
type="image"	- submit 버튼 대신 사용할 이미지 삽입.
src	- 이미지 파일 경로 지정.
alt	- 이미지가 보이지 않을 경우 나타나는 대체 text 지정.
type="button"	- 일반 버튼 삽입. = submit이나 reset 같은 기능이 없다는 뜻. - 주로 JAVASCRIPT 실행할 때 씀.
value	- button에 표시할 내용 지정.
type="file"	- 파일 첨부할 수 있는 버튼 삽입. - web browser마다 표시되는 내용은 다름.     ex, 파일 선택, 찾아보기 등
type="hidden"	- client에게는 (굳이 보여줄 필요 없어서) 안 보여주지만 server로 넘겨줘서 (관리자는 알아야 하는) 값이 있는 field 만듦.

 

몰랐는데

표를 작성하다보니까

field는 아이디, 비밀번호 같이 뭔가를 입력하는 칸.. 그런 걸 말하는 것 같음.