如何按组删除HTML5的本地存储？

Question

I am creating localstorage dynamically like below

window.localStorage["DBname"+count]=JSON.stringify(values)

at the same time i am also creating some other local storage like

window.localStorage["login_detail"]=login_string

window.localStorage["page_config"]=page_config

so i can not use window.localStorage.clear() ,because it will clear all my localstorage which i dont want, and also i can not use window. localStorage.removeItem["DBname"+count] because i count know how many "count" will come while execution.

so is there any way to delete localstorage like group delete kind of? help me out.

Answer 1

Simple solution

var prefix = "DBname",
    continue = true, 
    on = 0;

while (continue) {

    continue = localStorage.getItem(prefix + on)?true:false;

    try { localStorage.removeItem(prefix + on);  } catch (e) { continue = false; }
    on += 1;
}

This will remove all local storage items beginning with DBname

Tests

Start:

• DBname1
• DBblah
• DBnameCats
• DBname 2
• DBname 3

End:

• DBblah
• DBnameCats

---

An even better solution

var keys = Object.keys(localStorage),
    prefix = "DBname";
for (var i = 0; i < keys.length; i += 1) {
    if (keys[i].indexOf(prefix) === 0) {
        localStorage.removeItem(keys[i]);
    }
}

Tests

Start:

• DBname1
• DBblah
• foobar
• DBnameCats
• DBname 2
• DBname 3

End:

• DBblah
• foobar

Dealing with support

Add this one line:

Object.keys||(Object.keys=function(r){var e=[];for(var n in r)r.hasOwnProperty(n)&&e.push(n);return e});

That will let you use An even better solution on practically every browser.

Answer 2

I suppose you could iterate over all elements in the LocalStorage and find the keys you want to delete each individually.

A quick example would be:

function clearLocalStorageByKeyMatch(word) {

    // Find items in the array where he key contains the word 'word'
    var filtered = localStorage.filter(function(item, key) {
        return key.indexOf(word) > -1;
    });

    Object.keys(filtered).forEach(function(item) {
        localStorage[item] = null;
    });

}


// clear localStorage where config word appear
// clearLocalStorageByKeyMatch('config');

You can also look at a library that handles that for you.

Answer 3

Iterating though localStorage keys/items - NO

Iterating over all the localStorage keys is not a good solution. Since localStorage could be used by other applications as well, it would be very inefficient to iterate through all items in localStorage and then remove them.

What is the best Approach

Since you are the owner of you application, you better can maintain the counts. On a rough level you can keep the "counts" you want to delete in future, may be the start and end position of count in the localStorage itself.

Once you know the start & end limit of "Count" - iterate and delete all the "DbName + Count" found in localStorage.

Another Workaround

You can have one single entity as JSON object for your application. Think of it as you are name-spacing all the localStorage items and encapsulating all of them inside one single variable.

var myApp={
"Dbname1":{},
"Dbname2":{},
"login_detail":{},
"page_config":{}
};

for saving this into localStorage:

localStorage["myApp"]=JSON.stringify(myApp);

for retrieving it back:

var myApp=JSON.parse(localStorage["myApp"]);
//now you can delete whatever db you want from `myApp` and save it back to localStorage.

This will keep other application out of danger from your code.