<form> : 데이터를 전송해서 소통을 도와주는 역할
BlockLevel, 입출력 데이터의 자료형은 String
<form name="~~" method="post" action="~~~~">
name은 서버와 통신할 때 무조건 필요하다.
method의 default는 get방식, 보안을 위해서 post로 쓴다.
action은 폼의 정보를 처리할 url을 담는 속성이다. (없으면 "")
<input type="~~" name="~~" id="~~" size="20">
type : TextField = "Text", radioButton="radio", "checkbox", "Password", "email", "tel", "date", "number", "time",
"search", "submit", "reset"
name : 서버와 통신할 때 사용
id : 스타일링 할 때 사용
size : 알파벳 기준 ~글자 까지 작성 가능
radio : name을 전부 같게 설정해야 그룹화 된다.
checkbox : name을 같게해야 서버단에서 정보처리하기가 쉽다. (배열로 정리된다.)
<textarea> 내용안에 있는 빈칸을 모두 인식하니 주의해야한다. </textarea> // textarea엔 input이 포함되어 있다.
<input type="submit" Value="완 료"> value 속성안에 있는 빈칸은 모두 인식한다.
reset의 경우 HTML은 해당 내용을 날린다. 하지만 잘못 사용하면 서버 데이터를 날려버릴 수도 있으니 주의해야한다.
<input type="number" min="1" max="10" value="1" name="num">
min, max : 최소, 최대값 지정
value : 초기 설정값 지정
<input type="text" name="~~" autofocus required readonly>
autofocus : 자동으로 커서를 올린 상태로 지정된다.
required : 필수로 작성해야함 // not null, 원래 형식은 required="required"이다.
readonly : 읽기 전용으로 수정이 불가하다.
minlength, maxlength : 최소글자수, 최대글자수
type="password" : 패스워드 입력란, 패스워드 확인은 서버에서 진위판별을 해야한다.
type="email" : 이메일 형식이 맞는지 검사해준다.
Placeholder : TextField에 투명하고, 커서를 올리면 지워지는 글씨를 만들어준다.
Submit이 type="image"안에 포함되어 있기 때문에, image버튼은 무조건 Submit이다.
<select> : 콤보박스, multiple속성을 쓰면 여러개 선택이 가능하다.
ㄴ 자식 <option> : 선택할 항목, 배열로 value="~~" 값을 받아서 처리한다.
<input type="file" accept="image/*">
무슨 파일이든 1개 전송할 수 있다.
accept속성으로 파일 유형을 제한할 수 있으며, multiple 속성을 사용할 수 있다.
파일 업로드는 무조건 method="post"를 써야한다.
<input type="hidden" value="asd">
hidden은 form안에 있어야하며 value에 오는 값을 보고 통신을 체크한다.
브라우저에 보이지 않지만 정보를 머금거나 전달받거나 전송할 수 있다.
<input type="button" onclick="alert('Hello World!')" value="click">
onclick은 Javascript와 통신하는 속성이다.
on(시작 접두어) click(이벤트 명) = "alert('Hello World!') (함수 호출문)