Computer >> 컴퓨터 >  >> 프로그램 작성 >> HTML

HTML DOM 입력 텍스트 유형 속성

<시간/>

HTML DOM 입력 텍스트 유형 속성은 입력 텍스트의 유형을 반환/설정합니다.

구문

다음은 구문입니다 -

  • 문자열 값 반환
inputTextObject.type
  • 유형을 문자열 값으로 설정
inputTextObject.type = stringValue

문자열 값

여기서 "stringValue" 다음과 같을 수 있습니다 -

문자열 값 세부정보
이메일 입력 유형이 이메일임을 정의합니다.
텍스트 입력 유형이 텍스트임을 정의합니다.
라디오 입력 유형이 라디오임을 정의합니다.
전화 입력 유형이 tel이고 입력을 위해 숫자 키패드가 표시되도록 정의합니다.

예시

입력 텍스트 유형의 예를 살펴보겠습니다. 속성 -

<!DOCTYPE html>
<html>
<head>
<title>Input Text type</title>
<style>
   form {
      width:70%;
      margin: 0 auto;
      text-align: center;
   }
   * {
      padding: 2px;
      margin:5px;
   }
   input[type="button"] {
      border-radius: 10px;
   }
</style>
</head>
<body>
<form>
<fieldset>
<legend>Text-type</legend>
<label for="TextSelect"></label>
<input type="text" id="TextSelect" >
<input type="button" onclick="getTypeOfInput()" value="What to enter?">
</fieldset>
</form>
<script>
   var labelSelect = document.querySelector("label");
   var inputText = document.getElementById("TextSelect");
   function getTypeOfInput() {
      labelSelect.innerHTML = ' Plain '+inputText.type+': ';
   }
</script>
</body>
</html>

출력

이것은 다음과 같은 출력을 생성합니다 -

'무엇을 입력할까요?'를 클릭하기 전에 버튼 -

HTML DOM 입력 텍스트 유형 속성

'무엇을 입력할까요?'를 클릭한 후 버튼 -

HTML DOM 입력 텍스트 유형 속성