HTML DOM Fieldset form屬性用法及代碼示例

HTML DOM Fieldset 表單屬性返回表單對象類型的表單引用。這是針對給定表單中存在的 <fieldset> 元素。它是隻讀屬性。如果表單中不存在指定的字段集，則返回 null

用法

以下是字段集表單屬性的語法 -

fieldsetObject.form

示例

讓我們看一個 fieldset 表單屬性的例子 -

<!DOCTYPE html>
<html>
<head>
<script>
   function formId() {
      var field = document.getElementById("FieldSet1").form.id;
      document.getElementById("Sample").innerHTML = "The id of the form in which fieldset
      element is present is "+field;
   }
</script>
</head>
<body>
<h1>Sample FORM</h1>
<form id="FORM1">
<fieldset id="FieldSet1">
<legend>User Data:</legend>
Name:<input type="text"><br>
Address:<input type="text"><br>
Age:<input type="text">
</fieldset>
</form>
<br>
<button onclick="formId()">GET ID</button>
<p id="Sample"></p>
</body>
</html>

輸出

這將產生以下輸出 -

單擊“獲取 ID”按鈕時 -

在上麵的例子中 -

我們首先創建了一個 ID 為 “FORM1” 的 <form> 元素，其中包含一個 ID 為 “FieldSet1” 的 <fieldset> 元素 -

<form id="FORM1">
<fieldset id="FieldSet1">
<legend>User Data:</legend>
Name:<input type="text"><br>
Address:<input type="text"><br>
Age:<input type="text">
</fieldset>
</form>

然後我們創建了一個按鈕 GET ID，它將在用戶點擊時執行 formId() 函數 -

<button onclick="formId()">GET ID</button>

formId() 函數使用 getElementById() 獲取字段集元素，然後獲取其 form.id 屬性，該屬性返回給定字段集元素所在的表單 ID。 form.id 返回值分配給字段變量。然後該變量顯示在與 id “Sample” 關聯的段落中，並使用其 innerHTML 屬性分配預期文本 -

function formId() {
   var field = document.getElementById("FieldSet1").form.id;
   document.getElementById("Sample").innerHTML = "The id of the form in which fieldset element is    present is "+field;
}

相關用法

注：本文由純淨天空篩選整理自AmitDiwan大神的英文原創作品 HTML DOM Fieldset form property。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。