在本地存储中保存 JavaScript 数据的最佳方法

我希望能够创建 JavaScript 注释对象并使用导航栏窗格动态删除它们。

var sel = window.getSelection();
var range = sel.getRangeAt(0);
var editor = { "startContainer": range.startContainer, "startOffset": range.startOffset, "endContainer": range.endContainer, "endOffset": range.endOffset };

然后使用消息将位置和消息传递到函数中以添加注释：

Notes(editor, message);
function Notes(location, note) {
  this.location = location;
  this.note = note;
}

我正在尝试思考如何在本地实际保存数据。

function addNote() {
  // if(tyepof(Storage) !== "undefined"){
  //   if(localStorage.notes){
  //     localStorage.notes
  //   } else {
  //     localStorage.notes = 
  //   }

  localStorage.setItem()
}

localStorage 是正确的选择吗？我知道 sessionStorage 只存储会话。

这是从 a 生成一些元素的快速方法localStorage.getItem()致电，也许还可以帮助您以及纳尔逊的回答。单击小提琴中的按钮，您将看到代码获取 localStorage 对象并使用它们创建一些简单的<li>'s.

Fiddle: http://jsfiddle.net/kfrvdnux/

示例代码：

HTML

<button id='save'>Click the save button...</button>
<div id='content'></div>

JS

var content = document.getElementById('content'),
    save    = document.getElementById('save'),
    output  = '<ul>',
    animals = [{
      name: 'bob',
      type: 'dog'
    }, {
      name: 'fred',
      type: 'lizard'
    }];

// set on load for testing
localStorage.setItem('animals', JSON.stringify(animals));

// grab localStorage data on click and create a list
save.addEventListener('click', function() {
    var ls = JSON.parse(localStorage.getItem('animals'));  
    for (var i = 0; i < ls.length; i++) {
      output += '<li>' + ls[i].name + ', ' + ls[i].type + '</li>';
    }

  output += '</ul>';
  content.innerHTML = output;
});