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

HTML DOM 입력 라디오 객체

<시간/>

HTML DOM 입력 라디오 개체는 "radio" 유형의 요소와 연결됩니다. 각각 createElement() 및 getElementById() 메서드를 사용하여 라디오 유형의 입력 요소를 만들고 액세스할 수 있습니다.

속성

다음은 입력 라디오 개체의 속성입니다 -

Sr.No 속성 및 설명
1 자동 초점
페이지가 로드될 때 라디오 버튼이 자동으로 포커스를 받아야 하는지 여부를 설정하거나 반환합니다.
2 선택됨
라디오 버튼 체크 상태를 설정하거나 반환합니다.
3 defaultChecked
라디오 버튼의 checked 속성 기본값을 반환하려면
4 기본값
라디오 버튼 기본값을 설정하거나 반환합니다.
5 비활성화됨
라디오 버튼을 비활성화할지 여부를 설정하거나 반환하려면
6 양식
라디오 버튼이 포함된 양식에 대한 참조를 반환하려면
7 이름
라디오 버튼의 이름 속성 값을 설정하거나 반환합니다.
8 필수
양식을 제출하기 전에 라디오 버튼을 선택해야 하는지 여부를 설정하거나 반환합니다.
9 유형
라디오 버튼에 대한 양식 요소 유형을 반환합니다.
10 가치
라디오 버튼의 값 속성 값을 설정하거나 반환합니다.

구문

다음은 −

의 구문입니다.

입력 라디오 개체를 생성합니다.

var R = document.createElement(“INPUT");
R.setAttribute("type", "radio");

예시

입력 라디오 개체의 예를 살펴보겠습니다. -

<!DOCTYPE html>
<html>
<head>
<script>
   function createRadio() {
      var R = document.createElement("INPUT");
      R.setAttribute("type", "Radio");
      document.body.appendChild(R);
   }
</script>
</head>
<body>
<h1>Input radio object</h1>
<p>Create an input field with type radio by clicking the below button</p>
<button type=”button” onclick="createRadio()">CREATE</button>
<br><br>
Mango:
</body>
</html>

출력

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

HTML DOM 입력 라디오 객체

CREATE 버튼 클릭 시 -

HTML DOM 입력 라디오 객체

위의 예에서 -

사용자가 클릭할 때 createRadio() 메서드를 실행하는 CREATE 버튼을 만들었습니다 -

<button type=”button” onclick="createRadio()">CREATE</button>

createRadio() 메서드는 문서 객체의 createElement() 메서드를 사용하여 "INPUT"을 매개변수로 전달하여 요소를 생성합니다. 새로 생성된 입력 요소는 변수 R에 할당되고 setAttribute() 메서드를 사용하여 값이 radio인 유형 속성을 생성합니다.

setAttribute()는 속성을 생성하고 속성이 이전에 존재하지 않는 경우 값을 할당한다는 것을 기억하십시오. 마지막으로 문서 본문에서 appendChild() 메서드를 사용하여 라디오 유형의 입력 요소를 본문의 자식으로 추가합니다. -

function createPASS() {
   var R = document.createElement("INPUT");
   R.setAttribute("type", "Radio");
   document.body.appendChild(R);
}