HTML5 - Storing Things Locally: Web Storage(JSON API, stringfy method,parse method)

Head First HTML5 Programming
Building Web Apps with Javascript
(O'Reilly Media)
Eric Freeman (著), Elisabeth Robson (著)

開発環境

• OS X Yosemite - Apple (OS)
• Safari, Firefox, Google Chrome(Webプラウザ)
• Emacs (CUI)、BBEdit - Bare Bones Software, Inc. (GUI) (Text Editor)
• HTML5 (マークアップ言語)
• JavaScript (プログラミング言語)

Head First HTML5 Programming: Building Web Apps with Javascript(Eric Freeman (著)、Elisabeth Robson (著)、O'Reilly Media)のChapter 9(Storing Things Locally: Web Storage)、EXERCISE(No. 6640)を解いてみる。

その他参考書籍

• Head First HTML and CSS

EXERCISE(No. 6640)

JavaScript (BBEdit, Emacs)

var init = function () {
        var button = document.getElementById('sticky'),
            stickiesArray = localStorage['StickiesArray'],
            i,
            max;
    
        button.onclick = createSticky;    
        if (!stickiesArray) {
            stickiesArray = [];
            localStorage['stickiesArray'] = JSON.stringify(stickiesArray);
        } else {
            stickiesArray = JSON.parse(stickiesArray);
        };
        for (i = 0, max = stickiesArray.length; i < max; i += 1) {
            key = stickiesArray[i];
            value = localStorage[key];
            addStickyToDom(value);
        }
    },
    addStickyToDom = function (value) {
        var stickies = document.getElementById('stickies'),
            sticky = document.createElement('li'),
            span = document.createElement('span');
        
        span.setAttribute('class', 'sticky');
        span.innerHTML = value;
        sticky.appendChild(span);
        stickies.appendChild(sticky);
    };

window.onload = init;