相對HTML4，HTML5中新增的6大表單屬性，你掌握了幾個？

在html開發中，表單是頁面上重要的內容，用戶輸入內容大部分內容都是通過表單收集的，在html4中表單元素是相對繁瑣的，在html5中，吸納了web forms2.0標準，大大加強了針對錶單元素的功能。下面為大家介紹html5中新增的表單元素。

form元素

在html4中表單內的從屬元素必須寫在表單內部，在html5中沒有這個限制，可以寫在頁面任何地方，然後給該元素一個from屬性，屬性值為該表單的id，這樣就可以聲明該元素從屬於指定的表單了。示例代碼：textarea屬性被寫在form表單之外，但它從屬於form表單，所以將form表單id指定給textarea元素的form屬性。這樣的好處在於我們可以方便添加元素的樣式，因為它們不是分散在各表單之內。不過現在只是部分瀏覽器支持這一屬性。

formaction屬性

在html4中，一個表單所有的元素只能通過表單的action屬性統一提交另一頁面，而在HTML5中可以給所有的提交按鈕（、、），都增加了不同的formaction屬性，點擊不同的按鈕提交給不同的頁面。

placeholder屬性

placeholder是指當文本框（或）處於未輸入狀態時文本框顯示的輸入提示。只要加上了placeholder屬性，在指定提示文字就可以了。

autofocus屬性

給文本框、選擇框或按鈕加上該屬性，當畫面打開時，控制項自動獲得焦點。在html4中做到這個效果需要使用JavaScript如「control.focus()」。不建議隨意使用該屬性，比如搜索頁面中的搜索文本框。

list屬性

在html5中，為單行文本框增加了一個list屬性，該屬性的值為某個datelist元素的id。datelist也是html5新增的元素，該元素類似選擇框（select）。但是當用戶想要設定的值不在選擇列表時，允許自行輸入。該元素本身並不顯示，而是文本框獲得焦點時提示輸入的方式顯示。為了避免在沒有支持元素的瀏覽器顯示錯誤，可以用css將它設置為不顯示。

autocomplete屬性

輔助輸入所有的自動完成功能，節省輸入時間，同時也十分方便。可以指定「on」、「off」、「不指定」這三種值，不指定時，取決各個瀏覽器。屬性為on時，可以顯示指定候補輸入的數據列表，off反之。

如果有漏掉其他方法，歡迎大家補充。每天學習一個知識點，每日寄語「失敗只有一種，那就是半途而廢。」

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！