HTML DOM 입력 검색 개체는 "검색" 유형의 요소와 연결됩니다. 각각 createElement() 및 getElementById() 메소드를 사용하여 유형 검색으로 입력 요소를 생성하고 액세스할 수 있습니다.
속성
다음은 입력 검색 개체의 속성입니다 -
| 속성 | 설명 |
|---|---|
| 자동 완성 | 페이지가 로드될 때 검색 필드가 자동으로 포커스를 받아야 하는지 여부를 설정하거나 반환합니다. |
| 자동 초점 | 페이지가 로드될 때 검색 필드가 자동으로 포커스를 받아야 하는지 여부를 설정하거나 반환합니다. |
| 기본값 | 검색 필드 기본값을 설정하거나 반환합니다. |
| 비활성화됨 | 재설정 버튼이 비활성화되었는지 여부를 설정하거나 반환합니다. |
| 양식 | 검색 필드를 포함하는 양식의 참조를 반환하려면 |
| 목록 | 검색 필드를 포함하는 데이터 목록에 대한 참조를 반환합니다. |
| 최대 길이 | 검색 필드의 maxlength 속성 값을 설정하거나 반환합니다. |
| 이름 | 검색 필드의 이름 속성 값을 설정하거나 반환하려면 |
| 패턴 | 검색 필드의 패턴 속성 값을 설정하거나 반환합니다. |
| 자리 표시자 | 검색 필드의 자리 표시자 속성 값을 설정하거나 반환하려면 |
| 읽기 전용 | 검색 필드가 읽기 전용인지 여부를 설정하거나 반환하려면 |
| 필수 | 양식을 제출하기 전에 검색 필드를 채우는 것이 필수인지 여부를 설정하거나 반환합니다. |
| 크기 | 검색 필드의 크기 속성 값을 설정하거나 반환합니다. |
| 유형 | 검색 필드가 있는 양식 요소의 유형을 반환하는 읽기 전용 속성입니다. |
| 값 | 검색 필드의 값 속성 값을 설정하거나 반환합니다. |
구문
다음은 −
의 구문입니다.입력 검색 개체 만들기 -
var P = document.createElement("INPUT");
P.setAttribute("type", "search"); 예시
입력 검색 개체에 대한 예를 살펴보겠습니다. -
<!DOCTYPE html>
<html>
<head>
<script>
function createSearch() {
var S= document.createElement("INPUT");
S.setAttribute("type", "search");
document.body.appendChild(S);
}
</script>
</head>
<body>
<p>Create an input field with type search by clicking the below button</p>
<button onclick="createSearch()">CREATE</button>
<br><br>
FRUITS:
</body>
</html> 출력
이것은 다음과 같은 출력을 생성합니다 -
CREATE 버튼 클릭 시 -
