[카카오 클라우드스쿨 개발자 과정] HTML (1)

신하늘·2022년 11월 1일
0

Form Tag

Form => 웹 클라이언트에서 여러 데이터를 받아서 서버에게 한 번에 전송하기 위해서 사용한다.

Method 종류

GET : 데이터를 URL에 붙여서 전송하는 방식. 조회할 때 사용 - READ
데이터가 URL에 노출이 되기 떄문에 보안성이 떨어지고 데이터의 길이에 제한이 있음.
자동 재전송 기능이 있기 때문에 서버 나 네트워크가 일시적으로 사용 중지 되었다가 복구되는 경우 자동으로 전송되는 경우가 있다.

POST : 데이터를 헤더에 숨겨서 전송하는 방식으로 예전에는 READ를 제외한 모든 작업에 사용하였으나 지금은 삽입에만 사용하는 것을 권장함. - INSERT / CREATE

PUT : 전송 방법은 POST와 동일하지만 데이터 전체 수정에 사용 - UPDATE
PATCH : 전송 방법은 POST와 동일하지만 데이터 부분 수정에 사용 - UPDATE

DELETE : 전송 방법은 GET과 동일하지만 데이터 삭제에 사용 - DELETE

OPTIONS : 리소스가 지원하고 있는 메소드 취득
HEAD : 서버 리소스의 헤더
CONNECT : 프록시 동작의 터널 접속을 변경

Enctype : 보통 때는 설정하지 않아도 되고 파일을 전송하고자 하는 경우에만 multipart/form-data로 설정해주면 된다.
기본값은 application/x-www-form-urlencoded(인코딩해서 전송)이다.


그룹화 및 제목

그룹화를 하고자 할 때에는 fieldset을 이용하고 그룹에 제목을 붙이고자 할 때는 legend 태그를 이용해서 태그를 작성한다.


Label

텍스트를 출력할 때 사용
For 속성에 다른 입력 객체를 연결시킬 수 있다. 모바일에서는 많이 사용한다.


Input

사용자로부터 입력을 받거나 이벤틀를 받기 위한 용도로 사용하는 태그.
Type 속성은 종류를 선택하는 것인데 HTML4.01에서는 10가지가 있고 HTML5에서는 다양한 Type이 추가됨.

  • Text : 한 줄 입력
  • password: 한 줄을 입력받는데 텍스트가 마스킹되어서 보임
  • Radio : 여러 개 중 하나를 선택하게 할 때 사용
  • Checkbox : 여러 개 중에서 0개 이상을 선택하 게 할 때 사용
  • File : 파일
  • Image : 이미지
  • Submit : form의 데이터를 서버에게 전송하는 기본 역할을 수행
  • Reset : form의 데이터를 모두 삭제하는 기본 역할을 수행
  • Button : 버튼
  • Hidden : 눈에 보이지 않음

name 속성은 서버에게 전달할 때 같이 전송되는 이름이다.
radio나 checkbox를 하나의 그룹으로 만들 떄는 name 속성을 동일하게. => size, maxlength, checked, disabled, readonly 등이 있음.
radio를 만들 때는 디폴트로 하나의 데이터를 선택된 상태로 출력되도록 해주기
value는 값을 설정하는 것. text에서는 보여지는 글자가 되고 radio/checkbox에서는 디폴트 값이 된다. file에는 value 설정이 안된다.


Textarea

여러 줄의 글을 입력받고자 할 때 사용한다.
name, value, rows와 cols 속성을 제공한다.
value는 처음에는 사용할 수 없고 초기값은 태그 사이에 작성해야 한다.
여는 태그와 닫는 태그가 다른 줄에 있으면 커서가 첫번째에 찍히지 않는다.


Select

목록 태그.
select 태그 안에 option 태그로 목록을 만든다.
select에는 name을 설정하고 option에는 value를 설정한다.

profile
한창 구르고있는 신입 개발자

0개의 댓글