HTML|表單post和get送出
1.表單
表單是使用form标簽,我們可以為它設定一個action是目标網址,method是送出方式,可以分為get和post,這裡我們線将其設定為get:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表單</title>
</head>
<body>
<form action="method="get"></form>
</body>
</html>
假如我們要寫一個注冊頁面,我們需要有一個大标題是注冊,然後有一個使用者名輸入框,一個密碼輸入框:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表單</title>
</head>
<body>
<!--
表單form
action:表單送出的位置,可以是網站,也可以是一個請求處理位址
method:有post,get送出方式
-->
<form action=" method="get">
<h2>注冊</h2>
<!--
<input type="text">是文本輸入框
<input type="password">是密碼輸入框,預設是用小黑點表示密碼的
-->
<p>使用者:<input type="text" name="username"></p>
<p>密碼:<input type="password" name="pwd"></p>
</form>
</body>
</html>
打開網頁我們可以看到:

有個注冊、使用者輸入框和密碼輸入框,我們輸入可以看到:
因為密碼一欄的type我們設定為了password,是以是小黑點的樣子。
最後我們再添加上送出按鈕和重置按鈕即可完成:
計較按鈕是将input的type屬性改為submit,重置是改為reset:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表單</title>
</head>
<body>
<h2>注冊</h2>
<!--
表單form
action:表單送出的位置,可以是網站,也可以是一個請求處理位址
method:post,get送出方式
get方式能在目标位址看到送出的資訊,不安全,但是高效
post方式比較安全,可以傳輸大檔案
-->
<form action="Hdemo01.html" method="post">
<!--
<input type="text">是文本輸入框
-->
<p>使用者名:<input type="text" name="username"></p>
<!--
<input type="password">是密碼輸入框,預設是用小黑點表示密碼的
-->
<p>密碼:<input type="password" name="pwd"></p>
<!--
将input标簽的type改為submit即可生成一個送出按鈕
改為reset即可将該表單内的輸入框内容清空
-->
<p>
<input type="submit">
<input type="reset">
</p>
</form>
</body>
</html>
可以看到生成了送出按鈕和重置按鈕,我們輸入資訊過後點選送出:
可以看到我們點選送出按鈕之後是跳轉到了我的部落格頁面,另外再網址欄,出現了我填寫的資訊使用者和密碼,是以我們看出,這樣是不太安全的,因為method我們是設定了get,如果我們将其改為post,再次嘗試就會發現網址欄沒有了剛剛送出的資訊:
但是資訊也不是絕對安全的,我們同樣也可以找到剛剛輸入的資訊,但是會相對get較安全一些。