一、新增表单属性
1.1 form属性：声明带有该属性的元素从属于指定的表单（只有opera10支持）
<form id="my_form"> <input type="text"> </form> <textarea form="my_form"></textarea><!--该textarea元素虽然没有位于my_form表单中，但是form属性为其指定了从属的表单-->
1.2 formaction属性和formmethod属性：该属性覆盖 form 元素的 action 属性，适用于type="submit" 和 type="image"，可以将同一表单以不同的方式提交到不同的页面(尚且没有浏览器支持该属性)
<form id="my_form" action="s_01.asp"> <input type="submit" name="s_02" value="s_02" formaction="s_02.asp" formmethod="post">将该表单提交给s_02 <input type="image" name="s_03" value="s_03" formaction="s_03.asp" formmethod="get">将该表单提交给s_03 <button type="submit" name="s_04" value="s_04" formaction="s_04.asp" formmethod="post"/>将该表单提交给s_04 </form>
1.3 placeholder属性：文本框处于未输入状态未获取光标焦点前显示的输入提示，适用于<input type="text"><textarea>(safari4、chrome3、firefox4支持)
<input type="text" placeholder="请输入姓名">
1.4 autofocus属性：当页面打开，该控件自动获取光标焦点，一个页面只有一个控件使用该属性（safari4、chrome3、firefox4支持）
<form> <input type="text" placeholder="请输入姓名" autofocus> </form>
1.5 list属性：为单行文本增添的list属性，该属性的值为某一个datalist元素的id，以提示输入的方式显示，类似于select元素，如果需要输入的值不在datalist中，也可自行输入
<input type="text" placeholder="请输入姓名" autofocus list="my_data"> <datalist id="my_data" style="display:none;"><!--为了避免不支持datalist元素的浏览器显示出来，我们用CSS将其设置为不显示--> <option value="Jim">Jim</option> <option value="Sam">Sam</option> <option value="Willim">Willim</option> </datalist>
1.6 autocomplete属性：规定表单是否应该启用自动完成功能
二、新增input种类
2.1 url类型：专门用来输入url地址的文本框，输入值不是url地址格式，不允许提交，但不保证是确实存在的url，只保证格式正确，IE和Safari不支持
2.2 email类型：检查输入的文本的格式是否是email格式，并不检查该email地址是否存在，还有multiple属性，可以输入多个以逗号分隔的email地址
2.3 date类型：以日历的形式方便用户输入
2.4 time类型：外观取决于浏览器，在。，。。。浏览器中，它正常的文本框，仅在提交时检查输入的是否是有效的时间，在浏览器，，，，中，以时钟形式出现，携带时区
2.5 datetime类型：专门用来输入UTC日期和时间的输入框，并在提交时对输入进行有效性的检查
2.6 datetime-local类型：专门用来输入本地日期和时间的文本框
2.6 month类型：输入月份的文本框
2.7 week类型：专门用来输入周号的
2.8 number类型：专门用来输入数字的，有属性min、max、step属性，带有数值控制按钮，根据step进行增减，不超过最值
2.9 range类型：有min、max和step属性，只允许输入一段范围内的数值，用滑动条的形式进行值的设定
2.10 search类型：输入搜索关键词的文本框，外观可用css进行重新定义
2.11 tel类型：没有特殊的校验规则，不强制输入数字，有pattern属性来指定输入值的验证
2.12 color类型：提供一个颜色选取器，仅opera支持
<form id="my_form"> <label for="url">个人主页：</label> <input type="url" id="url" name="url"> <p></p> <label for="email">个人邮箱：</label> <input type="email" id="email" name="email"> <p></p> <label for="date">日期：</label> <input type="date" name="date" id="name"> <p></p> <label for="time">时间：</label> <input type="time" name="time" id="time"> <p></p> <label for="datetime">utc时间：</label> <input type="datetime" name="datetime" id="datetime"> <p></p> <label for="datetime-local">本地时间：</label> <input type="datetime-local" name="datetime-local" id="datetime-local"> <p></p> <label for="month">月份：</label> <input type="month" id="month" name="month"> <p></p> <label for="week">第几周：</label> <input type="week" name="week" id="week"> <p></p> <label for="number">数字：</label> <input type="number" min="0" max="100" step="5" name="number" id="number"> <p></p> <label for="range">范围：</label> <input type="range" min="0" max="100" step="5" id="range" name="range"> <p></p> <label for="search">搜索：</label> <input type="search" name="search" id="name"> <p></p> <label for="tel">电话：</label> <input type="tel" name="tel" id="tel"> <p></p> <label for="color">颜色：</label> <input type="color" name="color" id="color"> <p></p> </form>
三、表单的验证
3.1 自动验证：required属性(必填项);pattern属性(自定义验证规则);min与max属性;step属性
3.2 显式验证：checkValidity方法，调用该方法可以显式地对表单元素进行验证；form和input元素都存在一个validity属性，该属性返回一个ValidityState对象，该对象的valid属性表示表单内所有元素内容是否有效，或者单个input元素的输入是否有效
var e=document.getElementById("email"); if(e.checkValidity()){ alert("输入的email有效"); }
var e=document.getElementById("email"); if(e.validity.valid){ alert(1243); }else{ alert(11); }
3.3 取消验证：form的novalidate属性和input或者form的formnovalidate属性
form的novalidate属性可以关闭整个表单的验证；input的formnovalidate是对单个input元素不进行验证；submit按钮的formnovalidate属性是对整个表单验证失效
<input type="submit" formnovalidate="formnovalidate" value="提交">
3.4 自定义错误信息：setCustomValidity方法,只对没有默认提示的错误信息有效
pass2.setCustomValidity("密码不一致，请确认！");
四、figure元素：页面上一块独立的流内容，可以是图片、代码、统计图等，也可以是音频插件、视频插件，与主内容相关，移除的话，对文档流没有影响。figcaption是figure元素的标题，从属于figure元素一个figure元素最多只能有一个figcaption元素，必须放在figure元素内部，前后都可以
<figure> <figcaption>烧烤</figcaption> <img src="xxx.jpg" width="100" height="100"> </figure>
五、details元素：将区域展开或者收缩(chrome浏览器支持)
<details open><!--open属性，当页面加载时，处于展开状态--> <summary>疯狂原始人</summary> <p>《疯狂原始人》是讲述一个原始人家庭冒险旅行的3D喜剧。。。。。。。。。</p> </details>
六、mark元素：页面中需要突出显示或者高亮显示的，对用户有参考作用的文字，例如对全文检索某个关键字
<p><mark>《疯狂原始人》</mark>是讲述一个原始人家庭冒险旅行的3D喜剧。。。。。。。。。</p>
mark元素一般用于引用，并非原作者强调的，而是引用者为了引起用户的注意，strong是原作者强调的一段文字的重要性，例如警告、错误等，而em是原作者为了突出文章的重点而使用的
七、progress元素：一个任务的完成进度，value属性表示已经完成多少，max表示总的工作量
<p>进度：<progress id="progress" max="100"><span></span>%</progress></p> <input type="button" onClick="btn_click();" value="请加载"/>
function btn_click(){ var p=document.getElementById("progress"); p.getElementsByTagName("span")[0].textContent="0"; for(var i=0;i<=100;i++){ update(p,i); } } function update(p,new_value){ p.value=new_value; p.getElementsByTagName("span")[0].textContent=new_value; }
八、meter元素：规定范围内的数量值，例如磁盘的使用情况，某投票情况等
value属性：实际值；min：允许的最小值；max：允许的最大值；low：下限值；high：上限值；
optimum：最佳值，如果该值高于 "high" 属性，则意味着值越高越好，如果该值低于 "low" 属性的值，则意味着值越低越好。
<meter value="10" max="100" min="0"></meter>
九、menu元素：相当于其他语言开发工具中的菜单，command元素表示其他开发语言工具中的菜单项，
十、改良的ol元素：增加了start和reversed属性，可以自定义编号的起始值或者对列表进行反序排列
<ol start="9" reversed> <li>列表9</li> <li>列表10</li> <li>列表11</li> <li>列表12</li> </ol>
