参考资料

1. HTML DOM 返回和设置一个iframe中的scrolling属性的值
2. HTML DOM 修改
3. HTML DOM 返回一个链接的type属性的值实例
4. HTML DOM 节点列表
5. HTML DOM 返回和设置链接的href属性实例
6. HTML DOM 返回image的替代文本
7. HTML DOM 返回一个button的type 实例
8. HTML DOM 访问

HTML DOM 返回 button 所属表的 ID 实例

详细介绍

在 HTML DOM 中，可以通过 button 元素的 form 属性获取它所属的表单元素，然后通过表单的 id 属性获取表单的 ID。

标签

<button> 和 <form>

用法

var formId = document.getElementById("buttonId").form.id;

实例

<form id="myForm">
  <button id="myButton" type="button">点击获取表单ID</button>
</form>

<script>
document.getElementById("myButton").addEventListener("click", function() {
  var formId = this.form.id;
  alert("所属表单ID是: " + formId);
});
</script>

功能

• 获取 button 元素所属表单的 ID

• 可用于表单验证或动态表单操作

• 适用于需要知道按钮所属表单的场景

CSS 扩展

/* 为属于特定表单的按钮添加样式 */
button[form="myForm"] {
  background-color: #4CAF50;
  color: white;
  padding: 10px 15px;
  border: none;
  cursor: pointer;
}

/* 鼠标悬停效果 */
button[form="myForm"]:hover {
  background-color: #45a049;
}

声明：本站所有文章资源内容，如无特殊说明或标注，均为采集网络资源。如若本站内容侵犯了原著者的合法权益，可联系本站删除。