如何使用JavaScript檢索localStorage數據

Question

我試圖檢索所有設置的localStorage.setItem（），但目前不成功。

這是我的代碼

var base_url = window.location.origin;
$.ajax({
    type: 'POST',
    url: base_url + '/demo/now',
    dataType: 'json',
    success: function(data) {

        localStorage.setItem('visitor_info', JSON.stringify(data.visitor_info));
        localStorage.setItem('visitor_country', data.visitor_country);
        localStorage.setItem('phone2', data.phone2);
        localStorage.setItem('countryUrl', data.countryUrl);
    }
});

現在，我已經成功地將其保存到localStorage，但是我不知道如何檢索所有這些信息。

這是我檢索它的代碼。

function localStorageGetItem() {
    localStorage.getItem('visitor_country');
    localStorage.getItem('phone2');
    localStorage.getItem('countryUrl');

    return "blank so far"
}

我知道我需要將價值作為回報，但是我不確定如何返回所有這3個getItem。

這是我需要調用localStorageGetItem（）的地方

$(document).ready(function() {
    localStorageGetItem();
}

謝謝。

Answer 1

如果我正確地閱讀了此內容，聽起來您只是想返回一個對象，該對象的屬性與localStorage存儲的某些鍵匹配。

function localStorageGetItem() {
  return {
    visitor_country: localStorage.getItem('visitor_country'),
    phone2: localStorage.getItem('phone2'),
    countryUrl: localStorage.getItem('countryUrl')
  }
}

然后，您可以像這樣使用它...

var localData = localStorageGetItem();
console.log(localData.visitor_country); // etc

請記住，如果在通過localStorage.setItem存儲數據之前調用此屬性，則每個屬性都將為null 。

Answer 2

我知道我需要將價值作為回報，但是我不確定如何返回所有這3個getItem。

您可以將它們分配到新對象中，也可以像以前一樣通過localStorage獲取它們，因為它是全局屬性。

但是Jaromanda X回答了為什么您不能拒絕他們的問題

var base_url = window.location.origin;
var myStorage = {}
$.when($.ajax({
type: 'POST',
url: base_url + '/demo/now',
dataType: 'json',
success: function(data) {

    localStorage.setItem('visitor_info', JSON.stringify(data.visitor_info));
    localStorage.setItem('visitor_country', data.visitor_country);
    localStorage.setItem('phone2', data.phone2);
    localStorage.setItem('countryUrl', data.countryUrl);
    myStorage = localStorage

}
})).then(console.log(myStorage));