当前位置: 首页>>代码示例 >>用法及示例精选 >>正文


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。非经特殊声明,原始代码版权归原作者所有,本译文未经允许或授权,请勿转载或复制。