我們來實現一個簡單應用，該應用中使用者輸入使用者名稱和手機號，相關因襲可以儲存到儲存到本地，並可以進行查詢、展示等基本操作。
以下只給我出關鍵程式碼，專案結構和基本程式碼以及CSS樣式大家可以自己新增。
我們按照功能進行分佈完成。
1、儲存功能
這裡我們要完成，當用戶輸入姓名和手機號時，自己的資訊儲存到Web Storage中，html中程式碼如下：
XML/HTML Code複製內容到剪貼簿
姓名：手機號：
以上程式碼是一個表單，使用者輸入姓名和手機號後，點選新增記錄，即可在本地中儲存姓名-手機號鍵值對。具體的js中save函式程式碼如下：
JavaScript Code複製內容到剪貼簿 functionsave(){ varmobilePhone=lementById(“mobilephone”)e; varuserName=lementById(“username”)e; tem(mobilePhone,userName); }
Save函式的邏輯很簡單，就是取出使用者輸入的值，然後利用localStorage的setItem功能以鍵值對的形式將資訊儲存到Web Storage中。
2、查詢功能
查詢功能需要實現，當用戶輸入某個電話號碼時，顯示資料庫中對應查詢資訊。HTML程式碼如下：
XML/HTML Code複製內容到剪貼簿請輸入手機號：
其中result區域用來放置查詢的.結果。下面給出js中find函式的相關程式碼：
JavaScript Code複製內容到剪貼簿 functionfind(){ varsearch=lementById(“search”)e; varname=tem(search); varresult=lementById(“result”); rHTML=search+“:”+name; }
先獲取使用者輸入的手機號，然後利用getItem放大從資料庫中獲取手機號為這個的使用者名稱，最後一同顯示在result區域中。
以上兩個是最基本的功能，我們將會繼續探索本地儲存的高階用法，以及如何在移動應用中自如的運用本地儲存功能。
