HTML DOM Fieldset 表单属性
htmlweb developmentfront end technology更新于 2025/9/24 22:04:17
HTML DOM Fieldset 表单属性返回表单对象类型的表单引用。该属性针对的是给定表单中存在的 <fieldset> 元素。它是一个只读属性。如果表单中不存在指定的 fieldset,则返回 null。
语法
以下是 fieldset 表单属性的语法 −
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() 获取 fieldset 元素,然后获取其 form.id 属性,该属性返回指定 fieldset 元素所在的表单 ID。form.id 返回值被赋值给 field 变量。然后,该变量显示在与 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;
}
相关文章
有用资源
html 参考教程 - 该教程包含有关 html 的更多信息:https://www.cainiaomax.com/html/

