<input type=＂button＂>和<button>的区别
2025-02-01 04:54:28 来源: 阅读:
<input type="button">和<button>的区别:
标题中的两个标签几乎在外观上没什么区别，在用法上甚至都一样，下面就来介绍一下这两个按钮之间的区别。
区别一:
与<input type="button">相比，<button>标签形式更为丰富，<button>与<M(TMB@ZXI0L.tmp)
tton>之间除了文本之外，还可以是图片或者多媒体内容，不过不能是图像映射，因为它对鼠标和键盘敏感的动作会干扰表单按钮的行为。
区别二:
<button>的type属性一定要规定，否则可能出现一些问题，在IE浏览器中如果不加type就会被当做button按钮处理，但是在谷歌或者火狐等标准浏览器中会被当做提交按钮"submit"按钮处理。
区别三:
关于获取value属性值问题，看一下代码:
标题中的两个标签几乎在外观上没什么区别，在用法上甚至都一样，下面就来介绍一下这两个按钮之间的区别。
区别一:
与<input type="button">相比，<button>标签形式更为丰富，<button>与<
区别二:
<button>的type属性一定要规定，否则可能出现一些问题，在IE浏览器中如果不加type就会被当做button按钮处理，但是在谷歌或者火狐等标准浏览器中会被当做提交按钮"submit"按钮处理。
区别三:
关于获取value属性值问题，看一下代码:
<button value="蚂蚁部落一">蚂蚁部落</button> <input type="button" value="蚂蚁部落二">蚂蚁部落</button>
如果要获取value属性值的话，取值也不一样，在IE7和IE87下浏览器中，获取的<button>的value值是<button>与<YJ9NE7N2F$F)]O.tmp)
tton>之间的内容，而在其他标准浏览器中，则是获取的value属性的值。<input type="button">就是获取它的value属性值的值。
代码实例如下:
代码实例如下:
<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.51texiao.cn/" /> <title>蚂蚁部落</title> <script type="text/javascript"> window.onload=function() { var first=document.getElementById("first"); var second=document.getElementById("second"); alert(first.value); alert(second.value); } </script> <body> <input type="button" value="蚂蚁部落一" id="first" /> <button value="蚂蚁部落二" id="second">蚂蚁部落</button> </body> </html>
以上代码可以测试在不同浏览器下获取值是取自哪一部分。
原文地址是:http://www.51texiao.cn/HTML5jiaocheng/2015/0521/2132.html