<input type="button">和<button>的区别:
标题中的两个标签几乎在外观上没什么区别，在用法上甚至都一样，下面就来介绍一下这两个按钮之间的区别。
区别一:
与<input type="button">相比，<button>标签形式更为丰富，<button>与<tton>之间除了文本之外，还可以是图片或者多媒体内容，不过不能是图像映射，因为它对鼠标和键盘敏感的动作会干扰表单按钮的行为。
区别二:
<button>的type属性一定要规定，否则可能出现一些问题，在IE浏览器中如果不加type就会被当做button按钮处理，但是在谷歌或者火狐等标准浏览器中会被当做提交按钮"submit"按钮处理。
区别三:
关于获取value属性值问题，看一下代码:
<button value="蚂蚁部落一">蚂蚁部落</button> <input type="button" value="蚂蚁部落二">蚂蚁部落</button>
如果要获取value属性值的话，取值也不一样，在IE7和IE87下浏览器中，获取的<button>的value值是<button>与<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
时间： 2024-10-13 01:06:58