애트리뷰트(Attributes)

양식(form) 내에 있는 입력 요소들의 자동 채우기 설정을 지정한다. 자동 채우기는 다음과 같이 두 가지 방식이 가능하다.

자동 완성 기대 맨틀(autofill expectation mantle)

사용자로부터 예상되는 입력을 나타낸다. 설정하는 방법은 on 키워드는 활성되고 off 키워드는 비활성된다. 생략될 수 있으며 생략되거나 유효하지 않은 경우에 기본값은 on이다. type 애트리뷰트가 hidden이 아닌 경우 사용된다.

자동 완성 앵커 맨틀(autofill anchor mantle)

주어진 값의 의미를 설명한다. 자동 완성 세부 토큰으로 구성된 공백으로 구분된 토큰의 정렬된 집합인 값을 가져야 한다. on과 off 키워드는 사용할 수 없다. type 애트리뷰트가 hidden인 경우 사용된다.

지금까지의 내용은 HTML Standard 표준 사양에 나와있는 내용이지만 자동 완성 앵커 맨틀(autofill anchor mentle)에 대해 다음과 같은 이슈가 있다.

• type이 hidden인 요소에게 자동 완성 기능 적용이 올바른가? [open issue]
• 유저 에이전트에서의 동작 지원 여부가 명확하지 않다.

현재로서는 이 이슈에 대해 앞으로 시간을 두고 확인이 필요해 보이며 일반적인 자동 완성 기능인 자동 완성 기대 맨틀(autofill expectation mantle)의 구현을 위한 애트리뷰트라고 보는 편이 나을 것 같다.

양식(form)을 제출시 입력된 텍스트의 쓰기 방향(dir 애트리뷰트)을 참조한다. 유저 에이전트는 이 값을 사용하여 사용자가 입력한 값을 전송시 쓰기 방향 값도 함께 전송한다. 지정되지 않은 경우 유저 에이전트는 상위 요소의 dir을 사용한다. 그래도 명시된 방향을 알 수 없다면 유저 에이전트는 문서의 기본 방향을 사용한다.

이 애트리뷰트가 명시되면 양식 요소의 값은 빈 문자열이 아니어야 한다.

dirname은 "<attribute-name-value>-dir"로 설정한다.

<form>
  <input type="text" name="username" dirname="username-dir">
</form>

실제 전송(문서의 dir 애트리뷰트 값은 명시되지 않았다는 전제로 기본 값인 ltr로 전송된다.)

username=tom&username-dir=ltr

요소를 비활성화한다.

<form> 요소와 연결할 때 연결하고자 하는 <form> 요소의 id를 지정한다.

양식(form)이 제출될 때 서버쪽 처리 페이지 URL을 해당 <form> 요소가 아닌 지정 가능한 요소에서 지정한다. 명시되지 않은 경우 해당 <form> 요소에 명시된 action 애트리뷰트의 서버쪽 처리 페이지 URL로 전송된다.

양식(form)이 제출될 때 값의 인코딩 유형을 해당 <form> 요소가 아닌 지정 가능한 입력 요소에서 지정한다. 명시되지 않은 경우 해당 <form> 요소의 enctype 애트리뷰트에서 지정된 인코딩 유형으로 전송된다.

양식(form)이 제출될 때 전송 방식을 해당 <form> 요소가 아닌 지정 가능한 입력 요소에서 지정한다. 명시되지 않은 경우 해당 <form> 요소의 method 애트리뷰트에서 지정된 인코딩 유형으로 전송된다.

명시된 요소의 입력된 값이 제출될 때 입력된 데이터의 유효성 검사를 하지 않는다. 명시되지 않은 경우 상위 <form> 요소의 설정을 따라간다.

양식(form)이 제출될 때 action 또는 formaction 애트리뷰트에 설정된 서버쪽 처리 페이지를 여는 방식을 해당 <form> 요소가 아닌 지정 가능한 입력 요소에서 지정한다. 명시되지 않은 경우 해당 <form> 요소의 target 애트리뷰트에서 지정된 방식으로 연다.

두 개 이상의 값을 지정할 수 있는 여부를 나타낸다.

요소의 이름을 지정한다. 유저 에이전트(user agent)에서 식별값으로 사용되며 입력 요소에 지정된 name의 값은 서버에 전송시 데이터를 식별하는 이름으로 사용된다. 식별값으로 사용되지만 유일무이한 값으로 강제하지는 않는다. 그러한 이유는 <input type="checkbox"> 요소를 통해 이해할 수 있다. 체크박스 입력 방식은 준비된 동일한 이름의 데이터에서 다른 값을 선택하는 식이다. 따라서 값은 달라도 데이터의 이름은 동일할 수 있다.

양식(form)을 서버에 전송시 입력된 데이터에 대한 유효성 검사를 하지 않는다.

입력된 값을 검사할 정규식을 지정한다.

입력 요소에 입력할 값에 대한 힌트를 사용자에게 제시한다.

동일한 트리에서 popover 애트리뷰트가 있는 토글(toggle), 표시, 숨길 팝오버 요소의 id를 지정한다.

대상 팝오버(popover) 요소의 토글(toggle), 표시(show) 또는 숨김(hide) 여부를 나타낸다.

입력 요소에 대한 편집 가능 여부를 나타낸다. 지정이 되면 편집이 불가능하다.

필수로 입력해야 할 입력 요소로 지정할지 여부를 나타낸다. 지정이 되면 필수 입력 요소가 된다.

입력 요소의 기본 값을 지정한다.

양식(form)을 제출할 때 사용되는 문자 인코딩을 지정한다.

양식을 제출할 URL을 지정한다. 즉 작성된 데이터를 받아서 처리하는 서버 로직이 위치하는 URL을 의미한다.

양식(form)을 서버에 전송할 때 전송되는 데이터의 인코딩(MIME) 유형을 지정한다.

양식(form)을 서버에 전송할 때 전송 방식을 지정한다.

허용되는 파일 유형에 대한 힌트를 유저 에이전트에게 제공하기 위해 지정될 수 있다. type 애트리뷰트가 file인 경우에 사용이 가능하다.

아래에 예시된 유형 이외의 유효한 MIME 유형을 지정하거나 세부적인 파일 확장자를 지정할 수도 있다. 파일 확장자의 경우는 첫 문자가 닷(.)이어야 한다.

type 애트리뷰트가 checkbox이거나 radio일 때 유저 에이전트는 해당 요소가 선택된 상태로 처리한다.

요소에게 입력이 허용된 범위에서 최대값을 나타낸다. 입력된 값이 최대값을 벗어나는 경우 제약 조건 유효성 검사는 양식(form) 제출을 차단한다.

값이 최대값을 초과하면 스크립트에서는 validationState.rangeOverflow가 true가 되고 CSS에서는 :out-of-range 및 :invalid 가상 클래스와 일치한다.

max 애트리뷰트를 사용하는 타입은 다음과 같다. {{conn_doc_7911}}  

최대 입력 길이를 나타낸다.

요소에게 입력이 허용된 범위에서 최소값을 나타낸다. 입력된 값이 최소값보다 작은 경우 제약 조건 유효성 검사는 양식(form) 제출을 차단한다.

값이 최소값을 미만이면 유효하지 않으므로 CSS에서는 :out-of-range 및 :invalid 가상 클래스와 일치한다.

min 애트리뷰트를 사용하는 타입은 다음과 같다. {{conn_doc_7911}}  

최소 입력 길이를 나타낸다.

문자열을 입력하는 동안 가려지지 않고 볼 수 있는 문자 수를 나타낸다. 요소의 입력 방향 크기에 관여하지만 엄밀히 디자인적인 애트리뷰트는 아니다. 0보다 큰 값이며 기본 값은 20이다.

허용되는 값을 제한하여 값의 세분성을 지정한다. 직접 입력이외의 방식(스피너 버튼, 키보드 방향키, 마우스 휠 등)의 증감 신호를 통해서 값이 일정 크기로 변경되는 효과를 얻는다.

step 애트리뷰트를 사용하는 타입은 다음과 같다. {{conn_doc_7911}}  

<input>요소에서 입력 유형을 지정한다.

버튼의 역할을 명시적으로 지정한다.