在localStorage中存儲數組使用JSON.stringify

Question

我just learned about jquery's .makeArray我試圖使用JSON.stringify在localStorage中存儲數組，但我有意想不到的結果。

這工作：

var links = {'one': 1, 'two': 2 }; 
var setstr = JSON.stringify(links); 

localStorage.setItem('strlinks', setstr); 
var getstr = localStorage.getItem('strlinks'); 
console.log(getstr); //Returns what's expected - '{"one":1, "two":2}' 

這不：

var links = $.makeArray($('a')); 

alert(links); //Returns list of links 
var setstr = JSON.stringify(links); 

localStorage.setItem('strlinks', setstr); 
var getstr = localStorage.getItem('strlinks'); 
console.log(getstr); //Returns '[]' 

什麼我做錯了任何想法？

Answer 1

links包含循環引用，因此無法序列化爲JSON。 Chrome 5.0.375.99給出錯誤：

TypeError: Converting circular structure to JSON 

您必須以某種方式刪除這些循環引用。當然，這取決於你關心的是什麼信息。下面是一個簡化版本：

var flatLinks = $.map(links, function(el) 
          { 
           return {href: el.href, text: el.textContent}; 
          }); 
var setstr = JSON.stringify(flatLinks); 

Answer 2

$('a')選擇頁面上的所有鏈接（HTMLAnchorElement S）。

元素是由它們的身份和存在於文檔中定義的DOM節點。它們不是JSON可以表示的簡單值。如果你看看JSON.stringify()爲他們返回什麼，它只是{}：JSON說，它所知道的對象是它是一個Object。

試圖將一個節點放在localStorage內沒有任何意義;當你明天讀取存儲空間時，你期望得到什麼回報？一個Node對象，是昨天用戶關閉並銷燬的文檔的一部分？

如果你想記住的鏈接指向的，你應該從它們的href特性，能夠安全通過localStorage記住一個String -a簡單的值類型。