HTML DOM Fieldset 对象
JavaScript基础 2022-05-13 16:17:52小码哥的IT人生shichen
HTML DOM Fieldset 对象
Fieldset 对象
Fieldset 对象表示 HTML <fieldset> 元素。
访问 Fieldset 对象
您可以通过使用 getElementById() 来访问 <fieldset> 元素：
var x = document.getElementById("myFieldset");
完整实例：
<!DOCTYPE html>
<html>
<body>
<h3>演示如何访问 FIELDSET 元素</h3>
<fieldset id="myFieldset" name="personalia">
Name: <input type="text" name="username"><br>
Email: <input type="text" name="usermail"><br>
</fieldset>
<p>点击按钮来禁用 fieldset。</p>
<button onclick="myFunction()">试一下</button>
<p><b>注释：</b>Internet Explorer 和 Safari 不完全支持 Fieldset 对象的 disabled 属性。</p>
<script>
function myFunction()
{
var x = document.getElementById("myFieldset");
x.disabled = true;
}
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
提示：您也可以通过遍历表单的 elements 集合来访问 Fieldset 对象。
创建 Fieldset 对象
您可以通过使用 document.createElement() 方法来创建 <fieldset> 元素：
var x = document.createElement("FIELDSET");
完整实例：
<!DOCTYPE html>
<html>
<body>
<h3>演示如何创建 FIELDSET 元素</h3>
<p>点击按钮来创建包含文本的 FIELDSET 元素。</p>
<button onclick="myFunction()">试一下</button>
<script>
function myFunction()
{
var x = document.createElement("FIELDSET");
var t = document.createTextNode("Insert content here...");
x.appendChild(t);
document.body.appendChild(x);
}
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
Fieldset 对象属性
| 属性 | 描述 |
|---|---|
| disabled | 设置或返回 fieldset 是否被禁用。 |
| form | 返回对包含该 fieldset 的表单的引用。 |
| name | 设置或返回 fieldset 的 name 属性值。 |
| type | 返回 fieldset 的表单元素类型。 |
