button、input type="button"/"submit"整理

在一个页面上画一个按钮，有四种办法：

• <input type="button" /> 这就是一个按钮。如果你不写javascript 的话，按下去什么也不会发生。
  
• <input type="submit" /> 这样的按钮用户点击之后会自动提交 form，除非你写了javascript 阻止它。
  
• <button> 这个按钮放在 form 中也会点击自动提交，比前两个的优点是按钮的内容不光可以有文字，还可以有图片等多媒体内容。（当然，前两个用图片背景也可以做到）。它的缺点是不同的浏览器得到的 value 值不同；可能还有其他的浏览器兼容问题。
• 其他标签，例如 a, img, span, div，然后用图片把它伪装成一个按钮。

需要强调的一点是，其实 <input type="submit" />不是一个画面元素，而是一个表单（Form）元素，和文本输入是一样的，都属于“数据”的一部分（特征是，有value属性，而且该属性的值，会被传送到server端，可以拿来用），而不是样式的一部分。这种表现和数据混淆的设计，是早期web标准还比较简陋的时代的遗产。
从画面表现上看，通过CSS可以把两者描绘得完全一样。

----------------

在ie下，<button>标记恐怕还存在几个不大不小的问题。

1. 在一个表单里，如果有一个以上”submit”类型的<button>标签存在，在表单被提交时，不管你点击哪个<button>，所有<button>的值都会被post/get。
2. <button>的缺省type属性被设置为”button”，但是在A级别浏览器下，应该设置为”submit”才对
3. 如果你用javascript去访问<button>的value属性，IE却返回了<button>的innerHTML属性，很让人恼火。 (可以使用”getAttributeNode”方法来避免.)

<form>
<button type="submit" value="1" name="action-1">text 1</button>
<button type="submit" value="2" name="action-2">text 2</button>
</form>

在IE下，上面两个button的数据都会被提交。并且ie会提交这两个button的innerText而不是value。而其它浏览器仅仅提交你点击的那个button。