整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
html開發中，表單是頁面上重要的內容，用戶輸入內容大部分內容都是通過表單收集的，在html4中表單元素是相對繁瑣的，在html5中，吸納了web forms2.0標準，大大加強了針對表單元素的功能。下面為大家介紹html5中新增的表單元素。
form元素
在html4中表單內的從屬元素必須寫在表單內部，在html5中沒有這個限制，可以寫在頁面任何地方，然后給該元素一個from屬性，屬性值為該表單的id，這樣就可以聲明該元素從屬于指定的表單了。示例代碼：<form id="test"><input type="text"></form><textarea form="test"></textarea>textarea屬性被寫在form表單之外，但它從屬于form表單，所以將form表單id指定給textarea元素的form屬性。這樣的好處在于我們可以方便添加元素的樣式，因為它們不是分散在各表單之內。不過現在只是部分瀏覽器支持這一屬性。
formaction屬性
在html4中，一個表單所有的元素只能通過表單的action屬性統一提交另一頁面，而在HTML5中可以給所有的提交按鈕（<input type="submit">、<input type="image">、<button type="submit">），都增加了不同的formaction屬性，點擊不同的按鈕提交給不同的頁面。
placeholder屬性
placeholder是指當文本框（<input type="text">或<textarea>）處于未輸入狀態時文本框顯示的輸入提示。只要加上了placeholder屬性，在指定提示文字就可以了。
autofocus屬性
給文本框、選擇框或按鈕加上該屬性，當畫面打開時，控件自動獲得焦點。在html4中做到這個效果需要使用JavaScript如“control.focus()”。不建議隨意使用該屬性，比如搜索頁面中的搜索文本框。
list屬性
在html5中，為單行文本框增加了一個list屬性，該屬性的值為某個datelist元素的id。datelist也是html5新增的元素，該元素類似選擇框（select）。但是當用戶想要設定的值不在選擇列表時，允許自行輸入。該元素本身并不顯示，而是文本框獲得焦點時提示輸入的方式顯示。為了避免在沒有支持元素的瀏覽器顯示錯誤，可以用css將它設置為不顯示。
autocomplete屬性
輔助輸入所有的自動完成功能，節省輸入時間，同時也十分方便。可以指定“on”、“off”、“不指定”這三種值，不指定時，取決各個瀏覽器。屬性為on時，可以顯示指定候補輸入的數據列表，off反之。
如果有漏掉其他方法，歡迎大家補充。每天學習一個知識點，每日寄語“失敗只有一種，那就是半途而廢。”
、封裝獲取元素的方法
封裝思想——函數封裝——代碼復用
function get_id(id){
// 這個函數是專門來通過id獲取元素
return document.getElementById(id)
}
function get_els(parentId, tagName){
// 這個函數是專門來獲取某個父標簽范圍內的某些標簽
return get_id(parentId).getElementsByTagName(tagName)
}二、表單元素屬性
常用的表單元素包括 input、select、textarea、button等，下面我們學習這些表單元素中常用的屬性。
需求：點擊按鈕修改input的類型和內容
html和css代碼
<input type="button" value="按鈕" id="btn">JavaScript代碼
TML 5對表單新增了很多功能和屬性，可以更加方便地進行表單開發，form屬性代碼如下：
所以在HTML 5中定義了表單的從屬關系，而不再完全依賴form的位置。在下面的代碼中，輸入框txtPhone是屬于表單myForm的，因此可以提交輸入框內容。在之前的HTML中這種寫法是不能提交txtPhone輸入框的內容的。 placeholder屬性一般用于文本輸入框上，其主要作用是當文本框處于未輸入的狀態并且內容為空時，顯示一段提示文本內容。
<input type="text" id="txtUserName" class="form-control" placeholder="請輸入用戶名"/>
這個屬性達到的效果是我們常見的水印效果，如圖所示。
autofocus屬性的作用是指定控件自動活動的焦點，一個頁面中只能有一個控件具有該屬性。
HTML 5允許單行文本框中使用list屬性，配合datalist元素一起使用。list主要用于提示文本框輸入，datalist用于提供數據源，目前支持該特性的瀏覽器較少。
Autocomplete屬性用于完成自動輸入的功能，有兩個值；on和off，分別代表自動完成輸入和禁止自動完成輸入。很多瀏覽器不支持該屬性，但是自動完成插件是筆者平時使用較多的。
Required屬性是用作必填屬性，如果使用到了這個屬性則當表單中的元素為空時無法提交，此屬性作用于輸入框元素上。
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
