Form表單介紹

form表單有什么作用?

Form 表單用于接收不同類型的用戶輸入,用戶提交表單時向服務器傳輸數據,從而實現用戶與Web服務器的交互。

表單的工作機制

表單工作機制

有哪些常用的input 標簽,分別有什么作用?

text 單行文本框
password 密碼框
radio 單選框
checkbox 多選框
file 文件上傳
select 下拉框
option 下拉選項
textarea 多行文本
hidden 隱藏域
button 普通按鈕
submit 提交按鈕
reset 重置按鈕

POST 和 GET 方式的區別?

本質上,Get是向服務器發索取數據的一種請求,而POST是向服務器提交數據的一種請求。

GET請求:是把參數數據隊列加到提交表單的action屬性所指的URL中,如:http://www.xxx.com?username=subin&age=20。在URl中,值和表單標簽名稱各個字段一一對應,并且這些在URl中對用戶來說是可見的,即用戶時可以看到的。即:name=value

POST請求:POST請求會把請求的數據放置在HTTP請求包的包體中。也就是HTML HEADER內一起傳送到action屬性所指的URL地址。

因此,GET請求的數據會暴露在地址欄中,而POST請求則不會。

2、傳輸數據的大小
在HTTP規范中,沒有對URL的長度和傳輸的數據大小進行限制。但是在實際開發過程中,對于GET,特定的瀏覽器和服務器對URL的長度有限制。因此,在使用GET請求時,傳輸數據會受到URL長度的限制。

對于POST,由于不是URL傳值,理論上是不會受限制的,但是實際上各個服務器會規定對POST提交數據大小進行限制,Apache、IIS都有各自的配置。

3、安全性
POST的安全性比GET的高。這里的安全是指真正的安全,而不同于上面GET提到的安全方法中的安全,上面提到的安全僅僅是不修改服務器的數據。比如,在進行登錄操作,通過GET請求,用戶名和密碼都會暴露再URL上,因為登錄頁面有可能被瀏覽器緩存以及其他人查看瀏覽器的歷史記錄的原因,此時的用戶名和密碼就很容易被他人拿到了。除此之外,GET請求提交的數據還可能會造成Cross-site request frogery攻擊

4、另外
GET后退按鈕/刷新無害,POST數據會被重新提交(瀏覽器應該告知用戶數據會被重新提交)。
GET書簽可收藏,POST為書簽不可收藏。
GET能被緩存,POST不能緩存 。
GET歷史參數保留在瀏覽器歷史中。POST參數不會保存在瀏覽器歷史中。
GET編碼類型application/x-www-form-url,POST編碼類型application/x-www-form-urlencoded 或 multipart/form-data。為二進制數據使用多重編碼。
GET只允許 ASCII 字符。POST沒有限制。也允許二進制數據

在input里,name 有什么作用?

name:表單的名稱。注意和id屬性的區別:name屬性是和服務器通信時使用的名稱;而id屬性是瀏覽器端使用的名稱,該屬性主要是為了方便客戶端編程,而在css和javascript中使用的。

radio 如何 分組?

使用name相同的一組單選按鈕,不同radio設定不同的value值
<input type="radio" name="sex" value="男">男
<input type="radio" name="sex" value="女">女

placeholder 屬性有什么作用?

placeholder 屬性是 HTML5 中的新屬性。
placeholder 屬性提供可描述輸入字段預期值的提示信息(hint)。
該提示會在輸入字段為空時顯示,并會在字段獲得焦點時消失。
注釋:placeholder 屬性適用于以下的 <input> 類型:text, password、 search, url, telephone,以及 email
具體寫法:
<input type="password" name="password" placeholder="請輸入密碼">
效果展示:

type=hidden隱藏域有什么作用? 舉例說明

隱藏域具體寫法:
<input type="hidden" name="field_name" value="value">
hidden隱藏域無外乎下面六點作用:

  • 隱藏域在頁面中對于用戶是不可見的,在表單中插入隱藏域的目的在于收集或發送信息,以利于被處理表單的程序所使用。瀏覽者單擊發送按鈕發送表單的時候,隱藏域的信息也被一起發送到服務器。
  • 有些時候我們要給用戶一信息,讓他在提交表單時提交上來以確定用戶身份,如sessionkey,等等.當然這些東西也能用cookie實現,但使用隱藏域就簡單的多了.而且不會有瀏覽器不支持,用戶禁用cookie的煩惱。
  • 有些時候一個form里有多個提交按鈕,怎樣使程序能夠分清楚到底用戶是按那一個按鈕提交上來的呢?我們就可以寫一個隱藏域,然后在每一個按鈕處加上onclick="document.form.command.value="xx""然后我們接到數據后先檢查command的值就會知道用戶是按的那個按鈕提交上來的。
  • 有時候一個網頁中有多個form,我們知道多個form是不能同時提交的,但有時這些form確實相互作用,我們就可以在form中添加隱藏域來使它們聯系起來。
  • javascript不支持全局變量,但有時我們必須用全局變量,我們就可以把值先存在隱藏域里,它的值就不會丟失了。
  • 還有個例子,比如按一個按鈕彈出四個小窗口,當點擊其中的一個小窗口時其他三個自動關閉.可是IE不支持小窗口相互調用,所以只有在父窗口寫個隱藏域,當小窗口看到那個隱藏域的值是close時就自己關掉
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 1. form表單有什么作用?有哪些常用的input 標簽,分別有什么作用? 表單在web應用中主要是用來進行數據...
    yangjie727閱讀 881評論 0 0
  • <input>標簽 標簽用于搜集用戶信息,根據不同的type屬性值,輸入字段擁有很多種形式。輸入字段可以是文本字段...
    _空空閱讀 4,055評論 0 3
  • form表單有什么作用?有哪些常用的input 標簽,分別有什么作用? 標簽用于為用戶創建HTML表單,并向服務器...
    zx9426閱讀 605評論 0 1
  • 1.form表單有什么作用?有哪些常用的input 標簽,分別有什么作用? HTML 表單用于接收不同類型的用戶輸...
    大胡子歌歌閱讀 912評論 0 1
  • HTML表單 在HTML中,表單是 ... 之間元素的集合,它們允許訪問者輸入文本、選擇選項、操作對象等等,然后將...
    蘭山小亭閱讀 3,437評論 2 14