賬號密碼忘了別慌！一鍵扒出瀏覽器保存的密碼

在的瀏覽器都有保存密碼的功能，在登錄賬號的時候，選擇保存密碼的話，那么下次需要登錄這個賬號時，瀏覽器可以幫你搞定。

現(xiàn)在的瀏覽器可以幫你保存密碼

然而問題來了，不手動輸密碼，長久如此就會把密碼甚至賬號給忘了，遇到換瀏覽器、重裝系統(tǒng)或者換電腦的情況，沒有了保存的賬號密碼，只能對著登錄框干瞪眼嗎？把瀏覽器之前保存的密碼都扒出來，就可以解決問題！這就來為大家分享一下方法吧。

實際上，瀏覽器保存的密碼很多都是明文保存的，安全性由系統(tǒng)密碼確保，所以要扒出來并不難。瀏覽器自身也帶有查看保存的密碼的功能，例如Chrome在設置中就可以查看到，但并不能批量導出。因此，借助第三方工具導出瀏覽器保存的賬號密碼，是更好的方法。這里使用到個工具是“WebBrowserPassView”。

WebBrowserPassView官網(wǎng)地址：http://www.nirsoft.net/utils/web_browser_password.html

WebBrowserPassView是一款來自國外的綠色小軟件，解壓后直接運行即可。由于它會扒瀏覽器的密碼，因此很多殺毒軟件都會對其報毒，信任即可。

可能會報毒，添加信任即可

WebBrowserPassView支持多種瀏覽器，無論是Chrome、Firefox、IE、Opera等瀏覽器的密碼，都可以一鍵扒出來。它的使用也非常簡單，運行后，就可以看到主界面顯示出各個瀏覽器存儲的賬號密碼了。和單個瀏覽器只能到設置界面，一條條查看相比，這無疑方便得多。

主界面，各個瀏覽器中存儲的密碼都被扒了出來

如果發(fā)現(xiàn)缺少了某些密碼，刷新即可

WebBrowserPassView的一大妙用，就是批量導出密碼。在界面當中，你可以選擇多條賬號密碼信息，點擊右鍵批量復制，或者導出為HTML文件。有了這個功能，瀏覽器保存的所有密碼都可以一下子全部扒出來，或許有些賬號密碼你甚至已經(jīng)忘卻了它的存在，但此時卻又能再次呈現(xiàn)在你眼前了。

可以批量導出密碼

可以把瀏覽器保存的賬號、密碼導出為HTML文件，查看、使用都很方便

總的來說，這的確是一款非常實用的工具。如果你忘了某個賬號密碼，而它是保存在你的瀏覽器當中的，WebBrowserPassView絕對能帶給你驚喜。

責編：黎曉珊

絡用的多了，各種注冊、賬號、密碼也多了，管都管不過來，還好現(xiàn)在大多數(shù)瀏覽器都有各種類似帳號管家的功能，只要注冊登陸瀏覽器然后各種網(wǎng)站的賬號密碼只要登陸一次讓它記住就行了，全權委托給瀏覽器管理了，可有時確實需要這密碼，比如要手機上登陸什么的就抓了瞎，各種“找回密碼”、“忘記密碼”一通折騰費時又費力。

在來介紹一個簡單實用小技巧，無需任何工具軟件，利用HTML語言規(guī)則僅僅幾步就能讓你看到自己以前設定的密碼：

1、要讓這個密碼星號正常顯示出來，在密碼星號的輸入框中鼠標右擊，選擇最下面的“審查元素”。

2、此時會在瀏覽器的右側跳出網(wǎng)頁的HTML源代碼并以藍色選中，你不必要懂HTML，只要找到“type=password"就行。

3、將“password"改為"text"，然后回車，這時就會發(fā)現(xiàn)原來顯示星號密碼的部分已經(jīng)成功顯示當初設定的密碼了，經(jīng)測試了幾個市面常用的瀏覽器均行的通，如果有不能正常顯示的請留言。

還請用于正當用途。

篇介紹了表單的使用，表單有很多控件，比如輸入框，密碼框、文本域，按鈕等。按類型可分如下：

輸入類控件
菜單類控件

輸入類組件 —— input

此類控件有很多種類型，使用<input type="類型">語法，常見類型如下：

type 值	含義
text	文字字段
password	密碼域，用戶看不到明文，以*代替
radio	單選按鈕
checkbox	多選按鈕
button	普通按鈕
submit	提交按鈕
reset	重置按鈕
image	圖像域，用圖像作為背景的提交按鈕
hidden	隱藏域，不可見的輸入框
file	文本域，用于上傳文件等非文本數(shù)據(jù)

文本輸入框和密碼框

除了顯示形式不一樣，其它屬性一樣，有以下屬性：

name —— 定義文字字段名稱，用于和其它控件區(qū)別，不能包含特殊字符，也不可使用html 標簽名稱
maxlength —— 定義文本框可輸入字符最大長度
size —— 定義文本框在頁面中顯示的長度
vaule —— 定義文本框中默認的值

如下是文本輸入框和密碼框制作一個登錄表單

html代碼：

<!DOCTYPE html>
<html>
<body>
<h1>用戶登錄</h1>
<form action="/demo/html/action_page.php">
  <label for="fname">用戶名:</label><br>
  <input type="text" id="username" name="username" value=""><br>
  <label for="lname">密碼:</label><br>
  <input type="password" id="pwsd" name="pwsd" value=""><br><br>
  <input type="submit" value="提交">
</form> 
</body>
</html>

顯示效果：

HTML5 輸入類型

除了以上幾種類型，HTML5 還增加了多個新的輸入類型：

color
date
datetime
datetime-local
email
month
number
range
search
tel
time
url
week

如下代碼：

<!DOCTYPE html>
<html>
<body>
<form action="/demo/demo_form.asp">
  數(shù)字類型（1 到 5 之間）：
  <input type="number" name="quantity" min="1" max="5">
  IE9 及早期版本不支持 type="number"。<br>
  color 選擇顏色：
  <input type="color" name="color"><br>
   生日:
  <input type="date" name="bday"><br>
  年月：
  <input type="month" name="bdaymonth"><br>
  年周：
  <input type="week" name="week_year"><br>
  時間：
  <input type="time" name="usr_time"><br>
  一定范圍
   <input type="range" name="points" min="0" max="10"><br>
   E-mail:
  <input type="email" name="email">
  能夠在被提交時自動對電子郵件地址進行驗證<br>
  搜索：
  <input type="search" name="googlesearch"><br>
  電話：
  <input type="tel" name="usrtel">
  目前只有 Safari 8 支持 tel 類型。<br>
  url：
  <input type="url" name="url">
  提交時能夠自動驗證 url 字段<br>
  <input type="submit">
</form>
</body>
</html>

效果如下：

單選和多選按鈕

使用 type = “radio” 和 type =“checkbox” 定義是單選還是多選，除了name和value屬性外，單選和多選都有一個 checked屬性定義默認選擇的項，checked = “true”指選中那個選項，表單會將 checked = “true” 的選型值傳遞給后臺。

如下實例：

<!DOCTYPE html>
<html>
<body>
<h4>單選和多選</h4>
<form action="/demo/demo_form.asp">
水果：
<input type="radio" name="shuiguo" value="banner" checked> 香蕉
<input type="radio" name="shuiguo" value="apple"> 蘋果
<br><br>
省份：
<input type="checkbox" name="shengfen" value="shannxi" checked> 陜西
<input type="checkbox" name="shengfen" value="sanxi"> 山西
<input type="checkbox" name="shengfen" value="gdong"> 廣東
<br><br>
<input type="submit">
</form> 
</body>
</html>

顯示效果：

單選和多選傳遞給后臺的數(shù)據(jù)是不一樣的，如下會看到地址欄中的數(shù)據(jù)，多選會發(fā)送多個值，后臺將會獲取一個數(shù)組形式的數(shù)據(jù)。

/demo/demo_form.asp?shuiguo=banner&shengfen=shannxi&shengfen=sanxi

普通按鈕、提交按鈕、重置按鈕

普通按鈕：type = “button”，一般配合腳本使用，語法如下：

<input type="button" name="名稱" value="按鈕值" onclick="腳本程序" />

value 值就是按鈕在頁面顯示的文字，onclick屬性定義了腳本事件，這里指單擊按鈕時所進行的處理。

如下示例：

<!DOCTYPE html>
<html>
<body>
<form>
 <input type="button" value="普通按鈕">
<input type="button" value="打開窗口" onclick="window.open()">
<input type="button" value="您好" onclick="alert('您好')">
  </form>
</body>
</html>

單擊您好按鈕

提交按鈕：type = “submit”，用于提交表單內容，是一種特殊按鈕。

如剛才的登錄表單，提交后會返回結果：

重置按鈕：type="reset"，用于清除表單數(shù)據(jù)，也是一種特殊按鈕。

輸入數(shù)據(jù)

點擊重置按鈕后，表單數(shù)據(jù)清空

重置清空數(shù)據(jù)

HTML5 按鈕

除了使用input定義按鈕，還可以使用 html5 新增的<button> 標簽定義按鈕，button 使用語法如下：

<form action="/demo/html/action_page.php">
<button type="button">普通按鈕</button>
<button type="submit">提交按鈕</button>
</form>

其它輸入類控件

隱藏域 —— hidden
文件域 —— file

如下示例：

<form action="/demo/html/action_page.php">
  <label for="fname">隱藏域:</label>
  <input type="hidden" id="hidden" name="hidden" value=""><br>
  <label for="lname">文件域:</label>
  <input type="file" id="file" name="file" value=""><br>
  <input type="submit" value="提交">
</form>

顯示效果

可以看到，隱藏域在頁面中不顯示，單擊文件域選擇文件按鈕可以選擇文件，比如word文件，電子表格文件等，會以非文本方式傳送到后臺的，常用來實現(xiàn)文件上傳功能。

文本域 —— textarea

除了input 類型的控件，還有文本域 textarea ，一種特殊的文本框，它與input 文本輸入框的區(qū)別就是可以輸入多行文字，input 文本輸入框是單行的無法輸入多行文字。

如下示例：

<p>textarea 元素定義多行輸入字段。</p>
<form action="/demo/html/action_page.php">
  <textarea name="message" rows="10" cols="30">The cat was playing in the garden.</textarea>
  <br><br>
  <input type="submit">
</form>

效果如下：

rows 屬性定義文本域的高度是幾行，cols 定義文本域寬度占幾列，比如上面定義了高10行寬30列的文本域。

下拉菜單和多選列表

下拉菜單作用和單選按鈕類似，只不過它更加節(jié)省空間，當要選擇的選型很多時，就不適合使用radio空間，所以當選項很多的時候，使用下拉菜單，語法如下：

<select name="名稱">
<option value="選項值1" selected>選項1</option>
<option value="選項值2">選項3</option>
更多option......
</select>

多選列表和多選按鈕類似，一樣為了節(jié)省空間，當數(shù)據(jù)選項比較多時，使用多選列表，語法如下：

<select name="名稱" size="可看見的列表項數(shù)" multiple>
<option value="選項值1" selected>選項1</option>
<option value="選項值2">選項3</option>
更多option......
</select>

多選比下拉菜單不同之處是多了一個multiple屬性，定義多選的，且表現(xiàn)形式也不一樣，不是下拉而是一個列表。

如下代碼：

<!DOCTYPE html>
<html>
<body>
<form action="/demo/demo_form.asp">
下拉菜單：<br>
<select name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>
<br>
多選列表：<br>
<select name="cars" size="3" multiple>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>
<br><br>
<input type="submit">
</form>
</body>
</html>

顯示效果：

這里需要注意的是，多選列表多選時需要按住ctrl鍵同時鼠標單擊選擇才能多選，效果如下：

到這里，已介紹了大部分的表單控件，現(xiàn)在你可以使用他們制作自己的表單，表單通常在動態(tài)網(wǎng)站中使用，這為以后制作動態(tài)網(wǎng)站打下基礎。

還有許多屬性沒有講到，比如html5新增的一些屬性和功能，可自行參考 w3cshool 等網(wǎng)站學習，感謝關注，學習愉快！

上篇：前端入門——html 表單

下篇：前端入門 —— 網(wǎng)頁中使用窗口框架

在線咨詢

上一篇：HTML樣式：好看的顏色字體是有方法的
下一篇：DIV+CSS標準化網(wǎng)頁布局

您的項目需求

*請認真填寫需求信息，我們會在24小時內與您取得聯(lián)系。

整合營銷服務商

賬號密碼忘了別慌！一鍵扒出瀏覽器保存的密碼

輸入類組件 —— input

文本域 —— textarea

下拉菜單和多選列表

您的項目需求