HTML DOM Button 对象


HTML DOM Button 对象与<button>元素相关联。

属性

以下是 HTML DOM button 对象的属性:

属性描述
autofocus设置或返回页面加载时按钮是否自动获得焦点。
disabled设置或返回给定按钮是否被禁用。
form返回包含该按钮的表单的引用。
formAction设置或返回按钮的 formAction 属性值。
formEnctype设置或返回按钮的 formEnctype 属性值。
formMethod设置或返回按钮的 formMethod 属性值。
formNoValidate设置或返回提交时是否应验证表单数据。
formTarget设置或返回按钮的 formTarget 属性值。
name设置或返回按钮的 name 属性值。
type设置或返回按钮类型。
value设置或返回按钮值。

语法

以下是语法:

创建按钮对象:

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

示例

让我们来看一个 HTML DOM button 对象的示例:

<!DOCTYPE html>
<html>
<body>
<p>Click on the below button to create a BUTTON element</p>
<button onclick="buttonCreate()">CREATE</button>
<br><br>
<script>
   function buttonCreate() {
      var x = document.createElement("BUTTON");
      var t = document.createTextNode("NEW BUTTON");
      x.appendChild(t);
      document.body.appendChild(x);
   }
</script>
</body>
</html>

输出

这将产生以下输出:

点击 CREATE 后:

在上面的示例中:

我们首先创建了一个名为 CREATE 的按钮元素。单击此按钮将执行 buttonCreate() 函数。

<button onclick="buttonCreate()">CREATE</button>

buttonCreate() 方法使用 document 对象的 createElement() 方法创建一个按钮元素,并将其赋值给变量 x。使用 create 元素创建一个文本节点并将其赋值给变量 t。然后使用 appendchild 方法将文本节点 t 附加到按钮。然后使用 document.body.appendChild() 方法将按钮及其子文本节点作为子节点附加到文档正文。

function buttonCreate() {
   var x = document.createElement("BUTTON");
   var t = document.createTextNode("NEW BUTTON");
   x.appendChild(t);
   document.body.appendChild(x);
}

更新于:2019年8月7日

662 次浏览

启动你的职业生涯

完成课程获得认证

开始学习
广告