HTML 参考手册

HTML 标签大全

HTML: <button> 标签

HTML <button>标记是表示可单击按钮的元素,可以用在表单或文档其它需要使用简单标准按钮的地方。此标记通常也称为 <button>元素。

在线示例

以下代码标记一个按钮:

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>菜鸟教程(cainiaoplus.com)</title> 
</head> 
<body>

<button type="button" onclick="alert('你好,世界!')">Click me</button>
 
</body>
</html>
测试看看 ‹/›

浏览器兼容性

IEFirefoxOperaChromeSafari

所有主流浏览器都支持 <button> 标签。

标签定义及使用说明

<button> 标签定义一个按钮。

在 <button> 元素内部,您可以放置内容,比如文本或图像。这是该元素与使用 <input> 元素创建的按钮之间的不同之处。

HTML <button>元素位于<body>标记内。
<button>标记不能是放在<a>标记的后面。

提示:请始终为 <button> 元素规定 type 属性。不同的浏览器对 <button> 元素的 type 属性使用不同的默认值。

提示和注意

注释:如果在 HTML 表单中使用 <button> 元素,不同的浏览器可能会提交不同的按钮值。请使用 <input> 在 HTML 表单中创建按钮。

HTML 4.01 与 HTML5之间的差异

HTML5 中的新属性:autofocus、form、formaction、formenctype、formmethod、formnovalidate 以及 formtarget。

属性

New :HTML5 中的新属性。

属性描述
autofocusHTML5autofocus规定当页面加载时按钮应当自动地获得焦点。
disableddisabled规定应该禁用该按钮。
formHTML5form_id规定按钮属于一个或多个表单。
formactionHTML5URL规定当提交表单时向何处发送表单数据。覆盖 form 元素的 action 属性。该属性与 type="submit" 配合使用。
formenctypeHTML5application/x-www-form-urlencoded
multipart/form-data
text/plain
规定在向服务器发送表单数据之前如何对其进行编码。覆盖 form 元素的 enctype 属性。该属性与 type="submit" 配合使用。
formmethodHTML5get
post
规定用于发送表单数据的 HTTP 方法。覆盖 form 元素的 method 属性。该属性与 type="submit" 配合使用。
formnovalidateHTML5formnovalidate如果使用该属性,则提交表单时不进行验证。覆盖 form 元素的 novalidate 属性。该属性与 type="submit" 配合使用。
formtargetHTML5_blank
_self
_parent
_top
framename

规定在何处打开 action URL。覆盖 form 元素的 target 属性。该属性与 type="submit" 配合使用。
提交表单后指示在何处显示响应的名称或关键字。它可以是以下值之一:_self,_blank,_parent,_top

_self-表示响应加载到当前框架或上下文中
_blank-表示响应加载到新窗口或上下文中
_parent-表示响应加载到父框架或上下文
_top-表示响应加载到完整的原始窗口中

namename规定按钮的名称。
type

submit 

reset

button

规定按钮的类型。
提交-表示按钮将表单数据提交到服务器(如果未指定类型,则为默认值)
重置-表示按钮重置所有控件
按钮-表示该按钮没有默认行为

valuetext规定按钮的初始值。可由脚本进行修改。

全局属性

<button> 标签支持 HTML 的全局属性

事件属性

<button> 标签支持 HTML 的事件属性

相关文章

HTML DOM 参考手册: Button 对象