HTML DOM 單選按鈕物件


HTML DOM Input radio 物件與 type 為“radio”的 <input> 元素相關聯。我們可以分別使用 createElement() 和 getElementById() 方法來建立和訪問 type 為 radio 的 input 元素。

屬性

以下是 Input Radio 物件的屬性:

序號屬性及描述
1autofocus
設定或返回單選按鈕在頁面載入時是否應自動獲得焦點。
2checked
設定或返回單選按鈕的選中狀態。
3defaultChecked
返回單選按鈕的 checked 屬性的預設值。
4defaultValue
設定或返回單選按鈕的預設值。
5disabled
設定或返回單選按鈕是否應被停用。
6form
返回包含單選按鈕的表單的引用。
7name
設定或返回單選按鈕的 name 屬性值。
8required
設定或返回在提交表單之前是否必須選中單選按鈕。
9type
返回單選按鈕的表單元素型別。
10value
設定或返回單選按鈕的 value 屬性的值。

語法

以下是建立 Input radio 物件的語法:

建立單選按鈕物件。

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

示例

讓我們來看一個 Input 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>

輸出

這將產生以下輸出:

點選“建立”按鈕後:

在上面的例子中:

我們建立了一個名為“建立”的按鈕,當用戶點選它時,將執行 createRadio() 方法。

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

createRadio() 方法使用 document 物件的 createElement() 方法透過傳遞“INPUT”作為引數來建立 <input> 元素。新建立的 input 元素被賦給變數 R,並使用 setAttribute() 方法建立一個 type 屬性,其值為 radio。

請記住,setAttribute() 方法會在屬性不存在時建立屬性並賦值。最後,使用 document body 的 appendChild() 方法將 type 為 radio 的 input 元素作為 body 的子元素附加。

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

更新於:2021年2月15日

126 次瀏覽

啟動您的職業生涯

完成課程獲得認證

開始學習
廣告