button按钮的属性设置

作者:滴水穿石 | 创建时间: 2023-04-21
在网页中用户交互过程中,按钮是必不可少的重要组件之一,关于它的设计与实现,我们在网页标签中定义为<button type="button"></button>或者<input type="button"/>。关于问题的描述,在这里我们来说一...
button按钮的属性设置

html4版本/属性

name : 表示按钮的名称,通常作为按钮标识进行使用。 <button name="btn">按钮</button>

type : 表示按钮类型,通常与表单一起联用。 1. reset : 重置按钮 2. sumit : 提交按钮 3. button : 普通按钮 <button type="button">按钮</button>

value : 表示按钮初始值,通常在js脚本中进行使用和修改。 <button value ="点击">按钮</button>

disabled :表示禁用按钮,使按钮不能点击 <button disabled ="disabled">按钮</button>

html5/属性

以上是html4版本中常用的属性,相信在编写按钮的小伙伴也都会常用到,接下来将介绍一下,H5中对<button>新加的属性。

autoplay :当页面加载时按钮应当自动地获得焦点。 <button type="button" autofocus="autofocus">点击这里</button> 在实例中,我们会看到,第一次打开页面的时候,发现按钮出现了蓝色边框,就是所谓的焦点

新加的属性中,大多都是结合表单来配合使用的,在这里就不一一展示效果了,附上一张图示供大家参考。

相信了解了h5新加了属性后,我们在进行按钮操作表单的时候,会更加方便很多,对此我们也学习了关于<button>标签属性的使用。

点击展开全文

更多推荐