form

 

<datalist>

:input 태그의 list 속성에서 사용 가능한 목록들을 datalist 태그를 사용하여 따로 정의해줄 수 있다. datalist 에서 데이터 목록을 정의하고 list 속성에서 id 를 정의해주면 된다.

 

현재 firefox, opera 에서만 지원

<datalist id="">
   <option value="">
   <option value="">
   <option value="">
</datalist>

 

사용 예)

<input list="motors" /input>
<datalist id="motors">
   <option value="jaguarXF">
   <option value="discovery4">
   <option value="Wrangler rubicon">
</datalist>

 

 

<keygen>

:폼(form)양식에서 한 쌍의 키(암호화된 비밀번호)를 제공하는데, 폼이 키를 전송할 때 개인키(private key)는 로컬(개인 컴퓨터 안)에 저장하고 공동키(public key)를 서버에 전달하는 방식이다.

 

현재 chrome, firefox, opera 에서만 지원

<keygen name="security">

autofocus : 페이지가 로드될 때 자동으로 포커스가 지정

challenge :

disabled : 값을 이용하지 않게 지정

form : keygen 요소에 속하는 폼을 지정

keytype : 키 유형(보안알고리즘)을 정의

name : 요소의 이름을 지정

 

사용 예)

<form action="demo_keygen.asp" method="ger">
사용자 : <input type="text" name="user_name" />
암호화 : <keygen name="security" />
<input type="submit" />
</form>

 

공인인증제도와 keygen

*현재 우리나라에서만 사용되고 있는 공인인증제도는 한정된 브라우저와 OS에만 최적화되어 있으므로 변화가 시급하다. HTML5에서 이제 <keygen> 이라는 태그를 지원하므로 웹브라우저만으로도 손쉽게 처리될 수 있고 개인키를 로컬에 저장하는 방식이 보안성 면에서도 훨씬 우월하다.

 

 

<output>

:스크립트에 의한 계산 결과 같은 내용을 나타내는 새로운 태그이다. 일반적인 input 태그의 반대개념으로 폼 출력요소이다. 실제로 폼이 전송될 때 output 태그에 적힌 숫자도 함께 전송된다.

 

현재 opera 에서만 지원

<output name="result">100</output>

for : 요소와 계산결과 사이의 관계를 명시적으로 연결

form : 요소가 속한 폼을 지정

name : 요소의 이름을 지정

 

사용 예)

<input name="a" type="number"> + <input name="b" type="number"> =
<output name="result" onforminput="value=a.valueAsNumber + b.valueAsNumber"></output>

 

 

출처 : http://htmlcss.kr/html5/form-elements/