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

HTML DOM Fieldset name 屬性用於獲取或設置 <fieldset> 元素的 name 屬性值。 name 屬性有助於在表單提交後識別表單數據或簡單地引用表單元素。

用法

以下是語法 -

設置字段集名稱屬性 -

fieldsetObject.name = name

此處，name 指定字段集名稱。

示例

讓我們看一個 Fieldset name 屬性的例子 -

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

輸出

這將產生以下輸出 -

單擊“獲取名稱”按鈕 -

在上麵的例子中 -

我們首先在表單元素中創建了一個名為 “FS1” 和 ID “FieldSet1” 的字段集 -

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

然後我們創建了一個 GET NAME 按鈕，該按鈕將在用戶單擊時執行 fieldname() 方法 -

<button onclick="fieldName()">GET NAME</button>

fieldname() 方法使用 getElementById() 方法獲取字段集元素。然後它獲取其名稱屬性值並將其分配給變量字段。然後該值顯示在 ID 為 “Sample” 的段落中，並使用 innerHTML 屬性為其分配文本 -

function fieldName() {
   var field = document.getElementById("FieldSet1").name;
   document.getElementById("Sample").innerHTML = "The fieldset name is "+field;
}

相關用法

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