Computer >> Máy Tính >  >> Lập trình >> HTML

HTML DOM Input Thuộc tính loại radio

Thuộc tính kiểu radio Đầu vào HTML DOM được liên kết với phần tử đầu vào có kiểu =”radio”. Nó sẽ luôn trả về radio cho phần tử radio đầu vào.

Cú pháp

Sau đây là cú pháp cho thuộc tính kiểu radio -

radioObject.type

Ví dụ

Hãy để chúng tôi xem xét một ví dụ cho thuộc tính loại radio -

<!DOCTYPE html>
<html>
<body>
<h1>Input radio type Property</h1>
<form>
FRUIT:
<input type="radio" name="fruits" id="Mango">Mango
<br>
</form>
<p>Get the above input element type by clicking the below button</p>
<button type="button" onclick="radioType()">GET Type</button>
<p id="Sample"></p>
<script>
   function radioType() {
      var P=document.getElementById("Mango").type;
      document.getElementById("Sample").innerHTML = "The type for the input field is: "+P ;
   }
</script>
</body>
</html>

Đầu ra

Điều này sẽ tạo ra kết quả sau -

HTML DOM Input Thuộc tính loại radio

Khi nhấp vào nút GET Type -

HTML DOM Input Thuộc tính loại radio

Đầu tiên, chúng tôi đã tạo một phần tử đầu vào bên trong một biểu mẫu có type =”radio”, name =”fruit”, id =”Mango” -

<form>
FRUIT:
<input type="radio" name="fruits" id="Mango">Mango
</form>

Sau đó, chúng tôi tạo nút “GET Type” sẽ thực thi phương thức radioType () khi người dùng nhấp vào -

<button type=”button” onclick="radioType()">GET Type</button>

Phương thức radioType () nhận phần tử đầu vào bằng cách sử dụng phương thức getElementById () và gán giá trị thuộc tính kiểu của nó cho biến P. Sau đó, biến này được hiển thị trong đoạn có id “Sample” bằng cách sử dụng thuộc tính innerHTML -

function getType() {
   var P = document.getElementById("Mango").type;
   document.getElementById("Sample").innerHTML = "The type for the input field is : "+P;
}