一、HTML5新增輸入型別

　　1.新增type型別

　　　　Type=“number” 專門用來輸入數字的文字框

　　　　Type=“email” 限制使用者必須輸入email型別 “@”

　　　　Type=“url” 限制使用者必須輸入url型別 “http://”

　　　　Type=“range” 產生一個滑動條表單

　　　　Type=“search” 產生一個搜尋意義的表單 <input type=”search” name=“name名”/>

　　　　Type=“color” 生成一個顏色選擇的表單

　　　　Type=“time” 限制使用者必須輸入時間型別

　　　　Type=“month” 限制使用者必須輸入月型別

　　　　Type=“week” 限制使用者必須輸入周型別

　　　　Type=“datetime-local” 選取本地時間

　　2.智慧表單型別名詞解釋

　　　　1）Number：專門用來輸入數字的文字框；在提交時會檢查其中的內容是否為數字，具有min（最小值）、max（最小值）、step（步幅，數字間隔，建立一系列有效數字）的屬性；

　　　　　　例：<input name=“number1” type=“number” value=“25” min=“10” max=“100” step=“5” />

　　　　2）email：專門用來輸入email地址的文字框,如果該文字框中內容不是email地址格式的，則不允許提交；但它不檢查email地址是否存在；提交時可以為空，除非加上了required屬性；

　　　　3）url：專門用來輸入URL地址的文字框；如果該文字框中內容不是URL地址格式的，則不允許提交；

　　　　　　例：<input name=‘url1’ type=‘url’ value=‘’http://www.baidu.com”>

　　　　4）range：是用來只允許輸入一段範圍內數值的文字框，它具有min屬性與max屬性，及step屬性，可以指定每次拖動的步幅；

　　　　　　例：<input name=“range1” type=“range” value=“25” min=“0” max=“100” step=“5” />

　　　　5）Search：輸入的是搜尋的關鍵字，與type=“text” 基本上一樣；

　　　　6）Color：用來選取顏色；

　　　　7）(date, month, week, time, datetime, datetime-local)擁有多個可供選取日期和時間的新輸入型別；

　　　　　　date - 選取日、月、年

　　　　　　month - 選取月、年

　　　　　　week - 選取周和年

　　　　　　time - 選取時間（小時和分鐘）

　　　　　　datetime - 選取時間、日、月、年

　　　　　　datetime-local - 選取時間、日、月、年（本地時間）

　　　　　　例：<input type=“month” >

二、HTML5新增元素和屬性

　　（一）新增元素

　　　　1.output： 定義不同型別的輸出，如計算結果的輸出，或指令碼的輸出。

　　　　注：必須從屬於某個表單；即，必須將它書寫在表單內部；Output標籤IE不支援

　　　　Eg:

　　　　　　<form action="" oninput="x.value=parseInt(a.value)+parseInt(b.value)">

　　　　　　　　<input id="a" type="text" min="0" max="100">

　　　　　　　　<input id="b" type="text" value="50">=

　　　　　　　　<output id="x" for="a b"></output>

　　　　　　</form>

　　　　2.對新元素樣式的使用：

　　　　　　跟 input 標籤設定樣式一樣，但是要設定標籤中區域性的樣式不能實現；如改變日曆的背景色，顏色框的按鈕效果等，這些都不可以實現。

　　（二）新增屬性

　　　　1.placeholder屬性：文字框處於未輸入狀態時文字框中顯示的輸入提示；

　　　　　autofocus屬性：給文字框、選擇框、或者按鈕控制元件加上該屬性，當開啟頁面時，該控制元件自動獲得焦點，一個頁面只能有一個；

　　　　　required屬性：驗證輸入不能為空list屬性（結合datalist元素使用）；

　　　　　autocomplete屬性：輸入富足和所用的自動完成功能，是一個節省輸入時間，同時也十分方便的功能；它的屬性值為on/off，on可是顯示指定候補輸入的資料列表；

　　　　　eg：<input type="text" autocomplete="on" name ="greeting">

　　　　2.HTML5增加了大量在提交時對錶單及表單元素內容有效性驗證的功能

　　　　　　required屬性：可以應用在大多數輸入元素上（除了隱藏元素和圖片），在提交時如果元素內容為空白，則不允許提交，同時顯示提示文字；

　　　　　　pattern屬性：將屬性值設為某個格式的正則表示式，在提交時會檢查其內容是否符合給定格式；

　　　　　　　　例：<input pattern = “[0-9][A-Z]{3}” title="輸入內容：一個數與三個大寫字母" placeholder=‘輸入內容：一個數與三個大寫字母’>

　　　　　　novalidate屬性：取消驗證可以對form表單新增novalidate屬性，即使form表單中的input添加了required，也將不進行驗證

　　　　　　Multiple屬性：可以輸入一個或多個值，每個值之間用逗號分開

　　　　　　　　例：<input type=“email” multiple/>還可以應用於file