1、部分代码代替了以前的代码
例如：
- 获取焦点
旧：document.getElementById("price");.focus;
新：<input type="text" autofocus name="price" />
2、使用
HTML5之前，要表达一个文档的结构，只能通过<div>来实现；
在HTMl5之后，提供了更明确语义的元素，例如：
<header>...</header> <nav>...</nav> <article> <section> ...... ...... </section> </article> <aside>...</aside> <footer>...</footer>
3、基本结构的变化
以前的时候是： <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
现在只需要写： <meta charset=utf-8" /> 就OK了
注意：不要在<html><head>之间插入任何内容！不要在</head><body>之间插入任何内容！不要在</body></html>之间插入任何内容！
4、标签不再区分大小写
5、元素可以省略结束标签【空元素标签不允许开始标签和结束标签分开定义】
- 空元素语法的元素
<area> 用于定义图片映射的内部区域 <base> <br> <col> <command> <embed> <hr> <img> <input> <keygen> <link> <mata> <param> <source> <wbr>
- 可以省略结束标签的元素
<colgroup></colgroup> <dt></dt> <dd></dd> <li></li> <optgroup></optgroup> <option></option> <p></p> <rt></rt> <rp></rp> <thead></thead> <tbody></tbody> <tfoot></tfoot> <tr></tr> <td></td> <th></th>
- 可以省略全部标签的元素
<html></html> <head></head> <body></body> <tbody></tbody>
6、允许省略属性值的属性
7、允许属性值不使用引号
传统的XHTML按XML规范对属性值进行要求，要求所有的属性值都必须用引号引起来，但是HTML5允许直接给出属性值，即使不放在引号中也是正确的。
注：如果某个属性值中含有空格的话，由于空格容易引起浏览器混涿的属性值，那么就需要用引号将其括起来。
8、HTML5新增的通用属性
- contentEditable属性
HTML5为大部分元素都增加了contentEditable属性，如果将该属性设为true，那么浏览器将会允许开发者直接编辑该html中的内容，此处的html元素并不是指那些原本就可以编辑输入的表单元素。
contentEditable属性有一个可继承的特点：如果一个HTML元素的父元素是“可编辑”的，那么它默认也是可以编辑的，除非显式指定 contentEditable="false"。
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta name="author" content="Yeeku.H.Lee(CrazyIt.org)" /> 5 <meta http-equiv="Content-Type" content="text/html; charset=GBK" /> 6 <title> contentEditable属性 </title> 7 </head> 8 <body> 9 <!-- 直接指定contentEditable="true"表明该元素是可编辑的 --> 10 <div contentEditable="true" style="width:500px;border:1px solid black"> 11 疯狂Java讲义 12 <!-- 该元素的父元素有contentEditable="true"，因此该表格也是可编辑的 --> 13 <table style="width:420px;border-collapse:collapse" border="1"> 14 <tr> 15 <td>疯狂Java讲义</td> 16 <td>疯狂Android讲义</td> 17 </tr> 18 <tr> 19 <td>轻量级Java EE企业应用实战</td> 20 <td>经典Java EE企业应用实战</td> 21 </tr> 22 </table> 23 </div> 24 <hr/> 25 <!-- 这个表格默认是不可编辑的 26 双击之后该表格变为可编辑状态 --> 27 <table id="target" 28 ondblclick="this.contentEditable=true;" 29 style="width:420px;border-collapse:collapse" border="1"> 30 <tr> 31 <td>Java</td> 32 <td>Ruby</td> 33 </tr> 34 <tr> 35 <td>C/C++</td> 36 <td>Python</td> 37 </tr> 38 </table> 39 </body> 40 </html>
- designMode属性
designMode属性相当于一个全局的contentEditable属性，如果把整个页面的designMode都设置成 on 时，该页面上所有支持contentEditable属性的元素都变成可编辑状态；designMode属性值默认为off。
document.designMode="on" ;
例如：
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta name="author" content="Yeeku.H.Lee(CrazyIt.org)" /> 5 <meta http-equiv="Content-Type" content="text/html; charset=GBK" /> 6 <title> designMode属性 </title> 7 </head> 8 <body ondblclick="document.designMode=‘on‘;"> 9 <div>aaaa</div> 10 <table style="width:420px;border-collapse:collapse" border="1"> 11 <tr> 12 <td>疯狂Java讲义</td> 13 <td>疯狂Android讲义</td> 14 </tr> 15 <tr> 16 <td>轻量级Java EE企业应用实战</td> 17 <td>经典Java EE企业应用实战</td> 18 </tr> 19 </table> 20 </body> 21 </html>