1. 程式人生 > >HTML5+規範:Storage(管理應用本地資料儲存區)

HTML5+規範:Storage(管理應用本地資料儲存區)

   Storage模組管理應用本地資料儲存區,用於應用資料的儲存和讀取。應用本地資料與localStorage、sessionStorage的區別在於資料有效域不同,前者可在應用內跨域操作,資料儲存期是持久化的,並且沒有容量限制。通過plus.storage可獲取應用本地資料管理物件。

1、方法

1.1、getLength: 獲取應用儲存區中儲存的鍵值對的個數

              var foo = plus.storage.getLength();

返回值:Number : 鍵值對的個數

示例:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Storage Example</title>
<script type="text/javascript">
// H5 plus事件處理
function plusReady(){
}
document.addEventListener("plusready",plusReady,false);
// Get storage item length
function storageCount() {
return plus.storage.getLength();
}
</script>
</head>
<body>
獲取應用儲存區中儲存的鍵值對的個數<br/>
<button onclick="storageCount()">Count</button>
</body>
</html>


1.2、getItem: 通過鍵(key)檢索獲取應用儲存的值

         var foo = plus.storage.getItem(key);

引數:key: ( DOMString ) 必選 儲存的鍵值

返回值:DOMString : 鍵(key)對應應用儲存的值,如果沒有儲存則返回null。

示例:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Storage Example</title>
<script type="text/javascript">
// H5 plus事件處理
function plusReady(){
}
document.addEventListener("plusready",plusReady,false);
// Get storage item value
function getStorage() {
return plus.storage.getItem("test");
}
</script>
</head>
<body>
獲取應用儲存區中儲存的鍵值對的個數<br/>
<button onclick="alert(getStorage())">Get item(test)</button>
</body>
</html>


1.3、setItem: 修改或新增鍵值(key-value)對資料到應用資料儲存中

           void plus.storage.setItem(key, value);

說明:如果設定的鍵在應用資料儲存中已經存在,更新儲存的鍵值。 儲存的鍵和值沒有容量限制,但過多的資料量會導致效率降低,建議單個鍵值資料不要超過10Kb。

引數:key: ( DOMString ) 必選 儲存的鍵值

value: ( DOMString ) 必選 儲存的內容

返回值:void : 無

示例:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Storage Example</title>
<script type="text/javascript">
// H5 plus事件處理
function plusReady(){
}
document.addEventListener("plusready",plusReady,false);
// Remove storage item
function setStorage() {
plus.storage.setItem("test","test with hbuilder!");
}
</script>
</head>
<body>
修改或新增鍵值(key-value)對資料到應用資料儲存中<br/>
<button onclick="setStorage()">Set item(test)</button>
</body>
</html>


1.4、removeItem: 通過key值刪除鍵值對儲存的資料

        void plus.storage.removeItem(key);

引數:key: ( DOMString ) 必選 儲存的鍵值

返回值:void : 無

示例:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Storage Example</title>
<script type="text/javascript">
// H5 plus事件處理
function plusReady(){
}
document.addEventListener("plusready",plusReady,false);
// Remove storage item
function removeStorage() {
plus.storage.removeItem("test");
}
</script>
</head>
<body>
清除應用所有的鍵值對儲存資料<br/>
<button onclick="removeStorage()">Remove item(test)</button>
</body>
</html>


1.5、clear: 清除應用所有的鍵值對儲存資料

         void plus.storage.clear();

返回值:void : 無

示例:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Storage Example</title>
<script type="text/javascript">
// H5 plus事件處理
function plusReady(){
}
document.addEventListener("plusready",plusReady,false);
// Clear storage data
function clearStorage() {
plus.storage.clear();
}
</script>
</head>
<body>
清除應用所有的鍵值對儲存資料<br/>
<button onclick="clearStorage()">Clear</button>
</body>
</html>


1.6、key: 獲取鍵值對中指定索引值的key值

       var foo = plus.storage.key(index);

引數:index: ( Number ) 必選 儲存鍵值的索引

返回值:void : 無

示例:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Storage Example</title>
<script type="text/javascript">
// H5 plus事件處理
function plusReady(){
}
document.addEventListener("plusready",plusReady,false);
// Get value by index
function enumValueByIndex() {
var keyNames=[];
var values=[];
var numKeys=plus.storage.getLength();
for(var i=0; i<numKeys; i++) {
keyNames[i] = plus.storage.key(i);
values[i] = plus.storage.getItem(keyNames[i]);
}
}
</script>
</head>
<body>
獲取鍵值對中指定索引值的key值<br/>
<button onclick="enumValueByIndex()">Enum</button>
</body>
</html>