[HTML]폼 태그

1. 데이터를 전송할 때 사용하는 태그

2. 라벨
<labe>인풋의 설명</label>

인풋태그를 라벨에 감싸거나
<label for="아이디">설명</label>
<input id="아이디" />
라벨의 for 속성과 input의 id속성을 맞춰주면 label의 내용을 클릭하면 input이 포커스된다.

 

3. input 태그 name 속성 
폼 태그가 데이터를 전송할 때 데이터의 이름


4. input 태그 type속성

text 기본값
password 비밀번호
email 이메일
date 날짜
number 숫자

checkbox 체크박스 여러가지선택 가능 value기본값 on
radio 동그란 선택 버튼 여러가지 중 하나 value 기본값 on

select 지정 된 값 중에 선택(type이 아니라 태그임)

안에다 option 태그로 목록 생성

file 파일 (accept=".png,.jpg") (multiple)

textarea 긴 글(type이 아니라 태그임)


5. 버튼
<button>버튼</button>

기본적으로 제출이 된다.
type의 기본값은 submit
type을 button으로 바꿔주면 아무 기능이 없다.
type = "reset" 내용을 초기화한다.

폼 태그 밖에서 버튼 태그
전송하거나 리셋하지 않는다.

 

6. form의 method
GET: GET 메서드는 데이터를 URL 쿼리 문자열(query string)을 통해 전송합니다. 데이터는 URL에 노출되므로 주로 검색 쿼리와 같이 데이터를 URL에 표시할 때 사용됩니다. 데이터 양에 제한이 있으며, 보안 민감성이 낮은 정보에 사용됩니다.

POST: POST 메서드는 데이터를 HTTP 요청 본문(body)에 숨겨서 전송합니다. 데이터는 URL에 노출되지 않으며, 더 많은 데이터를 안전하게 전송할 수 있습니다. 비밀번호와 같은 민감한 정보를 전송할 때 주로 사용됩니다.


7. 그 밖에
input태그에 placeholder 속성
기본적으로 사용자에게 보여주는 인풋 안 메시지

required
해당 인풋의 입력은 필수

autocomlete = "on"
자동완성
"on" 위치에는 email, tel 등 다른 값을 지원함