23.03.08 / form 태그와 함께 쓸 수 있는 태그들

 

form 요소

- form 요소는 서버에 데이터를 전송하기 위한 태그

- 사용자에게 데이터를 입력 받아 작성된 데이터를 전달할 수 있다.

- 사용자가 웹 사이트로 정보를 보낼 수 있는 대부분의 요소들은 폼이다.

ex ) 로그인, 회원가입 등...

[공통 속성]

1) name : 폼의 이름을 지정하며, 서버에 전송될 데이터의 명칭

2) value : 서버에 전송될 데이터의 값

3) action : 데이터가 전송되는 URL(경로)

4) method : 데이터의 전달 방식을 작성하고, 사용자가 입력한 내용을 어떻게 서버에 넘겨줄 것인지 결정.

 - get : 호출되는 주소에 값을 등록하여 보내는 방식.

 - post : 데이터를 감춰서 서버에 전달한다. ex) 비밀번호

- enctype : 첨부 파일 전달 시 사용 ( 잘 안 씀 )

- autocomplete : 자동완성 기능을 위한 속성, 기본 값은 on -> autocomplete="off" 하면 꺼진다.

------------------------------------------------------------------------

button

이벤트를 발동 시키는 태그

[type]

1)button : 단순한 버튼임을 명시하며, 클릭이 가능한 버튼이다.

2)submit : 해당 버튼이 폼 데이터를 전송하는 버튼임을 명시한다.

3)reset : 해당 버튼을 클릭하면 작성한 폼 데이터를 초기화 한다.

------------------------------------------------------------------------

fieldset : 폼 안의 요소를 묶어준다.

-form 태그 안에 있는 입력 요소와 label을 그룹화한다.

-legend 태그는 필수 작성 태그는 아니지만, fieldset의 이름을 지정한다.

------------------------------------------------------------------------

<iframe>

실무에서 레거시 프로젝트라는 말을 한다.... 레거시 프로젝트가 뭐...?

10년 전 쯤...? 옛날에 쓰던 태그

-현재 문서(페이지)안에 다른 html 문서(페이지)를 삽입한다.

이제 쓰지 않는 이유

1)보안 : 해커가 해킹용 사이트를 다른 사이트에 집어 넣고, 그 사이트에 사용자가 입력하는 정보를 가로챌 위험이 있다.

(네이버 구글 같은 인증된 사이트는 iframe을 거부함)

2)사용성의 저하 : 사용자 입장에서 하나의 사이트에서 다른 사이트가 또 열리기 때문에 헷갈릴 수 있다.

3)검색이 제한된다. (네이버의 search advisor / 구글 애널리틱스 4 같은 사이트에서 사이트를 검색하며 그 사이트가 정상적인 사이트인지 로봇이 정보를 수집해서 추적 함 - 이때 iframe 안에 설정된 페이지는 포함되지 않는다.)