這裡是修真院前端小課堂，每篇分享文從
八個方面深度解析前端知識/技能，本篇分享的是：
【常見的表單元素有哪些？各有什麼屬性？ 】
表單元素是允許使用者在表單中(比如:文字域,下拉列表,單選框,核取方塊等等)輸入資訊的元素，最主要的作用就是收集資訊。表單元素是頁面中不可缺少的元素，在最新的h5中，表單元素也新增了一些屬性，在頁面構建中發揮了重要的作用。一般來說，表單包含如下幾個部分：
1. 提示資訊：表單中包含的說明性文字
2. 表單控制項：包含了具體的表單功能項
3. 表單域：容納所有表單控制項和提示資訊
常用的表單元素，包括：
1. form: 定義供使用者輸入的表單。
2. fieldset: 定義域。即輸入區加有文字的邊框。
3. legend：定義域的標題，即邊框上的文字。
4. label：定義乙個控制的標籤。如輸入框前的文字，用以關聯使用者的選擇。
5. input: 定義輸入域，常用。可設定type屬性，從而具有不同功能。
6. textarea: 定義文字域(乙個多行的輸入控制項)，預設可通過滑鼠拖動調整大小。
7. button: 定義乙個按鈕。
8. select: 定義乙個選擇列表，即下拉列表。
9. option: 定義下拉列表中的選項。
接下來是對這些表單元素的具體分析。
name : 表單名稱；action : 用來指定表單處理程式的位置（url）；method : 定義表單結果從瀏覽器傳送到伺服器的方式，預設為"get"（也可以是post）
name:控制項名稱；value:input控制項預設文字值；size:input控制項在頁面中的顯示寬度（必須是正整數）
input常用type屬性如下：
1. text：單行文字輸入框，可以通過正整數的size控制框長度。
2. password：密碼輸入框。
3. radio：單選按鈕，同一組的單選按鈕必須要有相同的name。
4. checkbox：核取方塊，同一組的單選按鈕必須要有相同的name。
5. button：普通按鈕。
6. submit：提交按鈕，每出現一次，乙個 submit 物件就會被建立。
7. reset：重置按鈕，會重置當前表單中全部的內容。
8. image：影象形式的提交按鈕，寫法是「」。
9. hidden：隱藏域，隱藏字段對於使用者是不可見的。
10. file：檔案域，用於檔案上傳。
選項1
size：下拉列表的可見選項數；multiple：多選。
在最新的html5中，有一些表單的新增屬性，多用於js，如
datalist : 定義填寫乙個input時，提示幾個option用於提示。可通過input的list特性與此元素作關聯。
output : 表示計算的結果。可通過for特性與其它能夠影響運算的元素（如input）作關聯。
還有一些新增的type屬性：
1. search：input會呈現為搜尋框（與text型別的唯一區別在於當滑鼠覆蓋時尾部出現叉號可快速清除輸入的內容）。
2. tel：編輯**號碼的控制項，提交時換行符會自動從輸入框中去掉。
3. url：編輯url的控制項，提交時換行符與首位的空格都將自動去除。
5. color : 選擇顏色的控制項。
6. date : 選擇年月日的控制項。
此外，還有time、datetime、datetime-local、month、week、number、range型別。
html5中input新增的一些較常用的特性：
1. list：關聯datalist所用的該datalist的id（即datalistform外建立，通過list關聯即可）。
2. pattern：乙個正規表示式，用於檢查控制項的值，可作用於text、search、tel、url、email型別的input。
3. form：乙個字串(為關聯的form表單的id)，用於表明該input屬於哪個form表單（作用類似list）。
4. formmethod：表明使用get還是post，能覆蓋form表單的method。僅在type為image或submit，且上面的form特性被設定的情況下才能使用。相似的有formtarget特性。
5. readonly：乙個boolean值，表明該input值是否能被使用者修改，可用於資訊展示等頁面。作用於type為hidden、range、color、checkbox、radio、file、button的input將被忽略。
6. maxlength：type為text、emal、search、password、tel或url（都為文字）時允許輸入的最大字元個數。
7. autocomplete：瀏覽器是否根據之前提交的輸入情況對此input自動填值（即以option形式匹配之前的輸入值），取值on或off，預設on。如在登陸頁面不想顯示上乙個登陸的使用者名稱等時，可設定為off。
參考文獻
1. html元素-表單元素及實用屬性：" target="_blank"
2. w3school html 表單 ： " target="_blank"
3. html5-input元素新特性 ：
問題整理
1. 使用input上傳檔案或應該怎麼辦
涉及到angularjs，可參考外掛程式
2. input為什麼不使用閉合標籤
input為自閉和標籤，詳見w3c標準
3. type="number"在輸入框右側有上下箭頭可以加減數字，怎麼去掉箭頭？
使用type="tel"時沒有右側上下箭頭
常見的表單元素有哪些？各有什麼屬性？
這裡是修真院前端小課堂，每篇分享文從 常見的表單元素有哪些？各有什麼屬性？表單元素是允許使用者在表單中 比如 文字域,下拉列表,單選框,核取方塊等等 輸入資訊的元素，最主要的作用就是收集資訊。表單元素是頁面中不可缺少的元素，在最新的h5中，表單元素也新增了一些屬性，在頁面構建中發揮了重要的作用。一般...
常見的表單元素選中
一 獲取select賦值ab 賦值方法 xuanzhe option selected text c 二 redio元素的選中 點選漢字即可以選中，但是後邊的一定是label標籤才行 radio name shouji id p1 for p1 style cursor pointer 蘋果 rad...
html 什麼是空元素？常用的空元素有哪些？
乙個空元素 empty element 可能是 html，svg，或者 mathml 裡的乙個不能存在子節點 例如內嵌的元素或者元素內的文字 的element。html，svg 和 mathml 的規範都詳細定義了每個元素能包含的具體內容 define very precisely what eac...