$$config title: [HTML] 폼(form) Tag Understand keywords: - form 동작 방법 - ... $$ # 폼 태그 속성 - 태그 속성에는 name, action, method, target등이 존재 - 태그 속성을 이용하여 전송할 때 위치와 보내는 방법 선택 - 태그 속성의 종류 - action : 전송할 서버 쪽 스크립트 파일을 지정 - name : 식별하기 위한 이름을 지정 - accept-charset : 전송에 사용할 문자 인코딩을 지정 - target : action에서 지정한 스크립트 파일을 현재 창이 아닌 다른 위치에 열도록 지정 - method : 서버에 전송할 http method를 지정(GET & POST) ```js < form action = "http://localhost:8080/form.jsp" accept-charset="utf-8" name = "person_info" method = "get"/ > ``` - 전송할 http 메소드 종류인 GET과 POST는 브라우저에서 폼 데이터를 가져와 서버로 보내는 똑같은 기능을 수행(방식은 다르다) - GET은 Form Data를 URL 끝에 붙여서 USER가 보이는 방식으로 전송 - POST은 내부적으로 보이지 않게 전송 ![](https://www.nextree.co.kr/content/images/2021/01/hjkwon-140328-form_-03-1.png) - 위쪽 그림은 GET 방식 & 아래쪽 그림은 POST 방식 - URL 끝에 데이터를 붙여 보내는 GET방식은 데이터가 외부에 노출로 인하여 보안에 취약 - 보내는 데이터가 개인정보나 보안을 해야하는 경우는 POST 방식을 사용 - HTTP method에서 GET방식은 지정된 리소스에서 데이터를 요청하는 경우인 읽을 때 사용하는 method - POST방식은 지정된 리소스에서 데이터를 처리할 경우(쓰고, 수정, 삭제)에 사용 - 보안이 필요하지 않으면서 지정된 리소스에서 자원을 읽을 경우는 GET방식, 반대인 경우 POST 사용 # 폼을 구성하는 다양한 엘리먼트 ## 폼 엘리먼트 그룸 ``````,``````Tag - ```

```Tag는 폼 태그 안에 관련 있는 form element들을 그룹화할 때 사용 - ```

```Tag 하위에 ``````Tag를 사용하여 그룹화한 폼 엘리먼트들을 목적에 맞게 이름을 지정 ```js ``` ![](https://www.nextree.co.kr/content/images/2021/01/hjkwon-140328-form_-04.png)