Открыть меню    

localStorage

Отметьте, чтобы увидеть localStorage, например, в firebug вам будет необходимо установить расширение FireStorage Plus!

В кэше браузера можно сохранять данные. localStorage – это хранилище для хранения данных вида: ключ/значение. localStorage в отличие от cookie позволяет хранить большой объем данных для определенного домена и для конкретного браузера. Данные сохраняются и после закрытия браузера.

Методы и свойства LocalStorage:

setItem(key, value)

setItem(key, value) устанавливаем значение заданного ключа. Например,

localStorage.setItem('keyname', 'value');
localStorage.setItem('bgcolor', 'red');

getItem(key)

getItem(key) получаем значение заданного ключа. Например,

localStorage.getItem('keyname');
localStorage.keyname

removeItem(key)

removeItem(key) удаляем ключ и соотв-е ему значение Например,

localStorage.removeItem('keyname')

clear()

clear() удаляем все пары вида ключ/значение. Например,

localStorage.clear()

length

length получаем сколько пар вида ключ/значение хранится в localStorage. Например,

localStorage.length

key(position)

key(position) возвращает ключ для значения, имеющего заданную числовую позицию. Например,

localStorage.key(pos)

Пример

jQuery or Javascript

var todoModel = (function () {

    var _data = [];

    function _addItem(name, duedate, description, completed) {
        _data.push({
            id: getCurrentId(),
            name: name,
            duedate: duedate,
            description: description,
            completed: completed
        });
    }

    function _save() {
        window.localStorage["tasks"] = JSON.stringify(_data, function (key, val) {
        // JSON.stringify() преобразует значение JavaScript в строку JSON
            if (key == '$$hashKey') {
                return undefined;
            }
            return val
        });
    }

    function _read() {
        var temp = window.localStorage["tasks"]

        if (!temp) _data = [];
        else _data = JSON.parse(temp);
        // JSON.parse() разбирает строку JSON, Возвращает объект

        return _data;
    }



    return {
        data: _data,
        addItem: _addItem,
        save: _save,
        read: _read
    };

})();

+ реализация работ функционала на angularjs:

    var testApp = angular.module("testApp", []);
    testApp.controller("testAppdCtrl", function($scope) {
        $scope.data = todoModel.read();
        // добавляем новый task при нажатии на кнопку
        $scope.addNewTask = function() {
            todoModel.addItem(
                $scope.taskName,
                $scope.taskDue_data,
                $scope.taskDescription,
                $scope.taskCompleted
            );

            todoModel.save();
            $scope.data = todoModel.read();
        }
        // очищаем localStorage
        $scope.clearTask = function() {
            localStorage.clear();
            $scope.data = todoModel.read();
        }
    });

Комментарии к статье