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

Đối tượng Radio đầu vào HTML DOM

Đối tượng vô tuyến HTML DOM Input được liên kết với phần tử có loại “radio”. Chúng ta có thể tạo và truy cập một phần tử đầu vào có kiểu radio bằng cách sử dụng phương thức createElement () và getElementById () tương ứng.

Thuộc tính

Sau đây là các thuộc tính của đối tượng Input Radio -

Sr.No Thuộc tính &Mô tả
1 Tự động lấy nét
Để đặt hoặc quay lại xem nút radio có tự động lấy tiêu điểm khi trang tải hay không.
2 Đã kiểm tra
Để đặt hoặc trả lại trạng thái đã chọn của nút radio.
3 defaultChecked
Để trả về giá trị mặc định của thuộc tính đã chọn cho một nút radio
4 defaultValue
Để đặt hoặc trả về giá trị mặc định của nút radio.
5 Đã tắt
Để đặt hoặc quay lại xem nút radio có nên tắt hay không
6 Biểu mẫu
Để trả lại tham chiếu đến biểu mẫu có chứa nút radio
7 Tên
Để đặt hoặc trả về giá trị thuộc tính tên của một nút radio.
8 Bắt buộc
Để đặt hoặc quay lại nếu bạn bắt buộc phải kiểm tra nút radio trước khi gửi biểu mẫu.
9 Loại
Để trả về kiểu phần tử biểu mẫu cho nút radio.
10 Giá trị
Để đặt hoặc trả về giá trị của thuộc tính giá trị của nút radio.

Cú pháp

Sau đây là cú pháp cho -

Tạo một đối tượng radio đầu vào.

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

Ví dụ

Hãy để chúng tôi xem xét một ví dụ về đối tượng radio Đầu vào -

<!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>

Đầu ra

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

Đối tượng Radio đầu vào HTML DOM

Khi nhấp vào nút TẠO -

Đối tượng Radio đầu vào HTML DOM

Trong ví dụ trên -

Chúng tôi đã tạo một nút CREATE sẽ thực thi phương thức createRadio () khi người dùng nhấp vào -

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

Phương thức createRadio () sử dụng phương thức createElement () của đối tượng tài liệu để tạo phần tử bằng cách chuyển “INPUT” làm tham số. Phần tử đầu vào mới tạo được gán cho biến R và sử dụng phương thức setAttribute (), chúng tôi tạo một thuộc tính kiểu với giá trị radio.

Hãy nhớ rằng setAttribute () tạo thuộc tính và chỉ định giá trị nếu thuộc tính đó không tồn tại trước đó. Cuối cùng, bằng cách sử dụng phương thức appendChild () trên phần thân tài liệu, chúng tôi nối phần tử đầu vào với kiểu radio là phần tử con của phần thân -

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