The difference between button and input Type=button and the matters needing attention

<button> label definition and usage

<button> tag defines a button.
Inside the button element, you can place content, such as text or an image. This is the difference between the element and the button created by using the INPUT element.
<button> controls provide more powerful functionality and richer content than <inputtype= "button" >. All content between <button> and </button> tags is the content of the button, including any acceptable body content, such as text or multimedia content. For example, we can include an image and related text in the button and use them to create an attractive tag image in the button.
The only prohibited element is an image map because its mouse-and keyboard-sensitive actions interfere with the behavior of the form button.
Always specify the Type property for the button. The default type of InternetExplorer is "button", while the default value in other browsers (including the Web specification) is "submit".

Browser support

All major browsers support <button> tags.
IMPORTANT: If you use the button element in an HTML form, different browsers will submit different values. InternetExplorer will submit the text between <button> and <button/>, while other browsers will submit the contents of the Value property. Use the INPUT element in an HTML form to create a button.

Precautions

When using <button> tags it is easy to assume that the <inputtype= "button" > is used, which can easily produce the following error usage:
1, through $ (' #customBtn '). Val () Gets the value of <buttonid= "custombtn" value= "Test" > button </button>value
In IE kernel, the use of the value is "button", instead of "test", non-IE get "test". Participate in the first sentence of the above red.
This should be separated from the <inputtype= "button" > area.
In both ways $ (' #customBtn '). Val (), $ (' #customBtn '). attr (' value ') in the different browsers to get the values, as follows:

Verify that this can be tested in the following code

2, inadvertently put <button> tags in the <form> tag, you will find that click on this button into the submission, equivalent to <inputtype= "Submit"/>
This point, see the second sentence above the red words will understand what the meaning. Do not take the <button> tag as the input element in <form>.
Verify that this can be tested in the following code