<input type=＂button＂>和<button>的区别

时间：2015-07-09 21:18:21 阅读：113 评论：0 收藏：0 [点我收藏+]

标签：

<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

<input type=＂button＂>和<button>的区别

标签：

原文地址：http://www.cnblogs.com/come-on/p/4634159.html

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)

周排行