button标签与input type=button标签使用的差异

button标签和input type=button标签都是html文档中用来表示按钮属性的元素,不过他们在布局和实际使用功能中存在一些差异。

下面将项目中遇到的一些总结如下:

1.属性和布局差异。

(a)width/height属性的差异

button标签的的width 和height属性是包括border在内的;

Input  type=button的border则是在设定的width和height之外在加上border的宽度;

 

如下图中右上方红色边框为button标签;右下角红色边框为input type=button标签,width均为30px ,height为100px

 button标签与input type=button标签使用的差异_第1张图片

2.功能使用上的差异

(a)val()获取值的差异

在使用 value的值

     在IE(IE内核)下这样用到得的是值是“按钮”,而不是“test”,非IE下得到的是“test”。

button标签与input type=button标签使用的差异_第2张图片

(a)button更多的功能

在 button 元素内部,您可以放置内容,比如文本或图像。

转载于:https://www.cnblogs.com/csuwujing/p/7910535.html

你可能感兴趣的:(button标签与input type=button标签使用的差异)