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