JavaScript Fieldset对象(Fieldset Object)

Fieldset对象代表了HTML文档中的fieldset元素

如何访问Fieldset对象?

使用getElementById()访问fieldset元素。

var  x = document.getElementById("myFieldset");

如何创建Fieldset对象

使用createElement()方法创建fieldset元素。

var x = document.createElement("fieldset");
Fieldset对象的属性
属性 说明
disabled【5】 设置或返回表格输入框是否被禁用
form【5】 返回与fieldset元素的内容建立联系的表单
name【5】 设置或返回fieldset元素上的name属性的值
type 返回fieldset元素上的type属性的值

标准属性及事件

Fieldset对象同时支持标准的属性事件

使用例1

HTML+Javascript文件

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

</head>

<body>

<h3>如何访问 FIELDSET元素</h3>

<fieldset id="myFieldset" name="personalia">

姓名: <input type="text" name="username"><br>

Email: <input type="text" name="usermail"><br>

</fieldset>

<p>点击以下按钮,禁止使用以上输入框</p>

<button onclick="myFc()">按钮</button>

<script>

function myFc() {

var x = document.getElementById("myFieldset");

x.disabled = true;

}

</script>

</body>

</html>

使用例2

HTML+Javascript文件

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

</head>

<body>

<h3>如何创建 FIELDSET元素</h3>

<p>点击以下按钮,创建一个fieldset元素</p>

<button onclick="myFc()">按钮</button>

<script>

function myFc() {

var x = document.createElement("FIELDSET");

var t = document.createTextNode("内容...");

x.appendChild(t);

document.body.appendChild(x);

}

</script>

</body>

</html>

关联内容