Jquery 使用JSON.stringify在localStorage中存储阵列

Jquery 使用JSON.stringify在localStorage中存储阵列,jquery,arrays,json,local-storage,Jquery,Arrays,Json,Local Storage,我和我正试图使用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 wh

我和我正试图使用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 '[]'

你知道我做错了什么吗?

链接包含循环引用,因此无法序列化为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);
$('a')
选择页面上的所有链接(
htmlanchoreElement
s)

元素是由其标识和在文档中的存在性定义的DOM节点。它们不是JSON可以表示的简单值。如果您查看
JSON.stringify()
为它们返回的内容,它只是
{}
:JSON表示它所知道的关于对象的一切就是它是一个
对象

试图将节点放在
localStorage
中没有任何意义;明天阅读存储时,您希望得到什么?作为用户昨天关闭并销毁的文档一部分的节点对象


如果你想记住链接指向的位置,你应该从它们的
href
属性中获取,作为
字符串
——一种简单的值类型,可以被
本地存储安全地记住

也许我查错了树,但这是用于chrome扩展的。我的想法是将数组从内容脚本添加到localStorage,然后当用户单击浏览器图标时,循环浏览链接并在弹出窗口中显示它们。我不熟悉chrome扩展,但据我所知,弹出窗口不能直接从内容脚本访问变量,因此需要本地存储。但是我可能有点离题。链接的引用不能放在
字符串中,只有
localStorage
会存储。但是弹出窗口不需要触摸链接本身,是吗?它只需要知道链接指向的URL(
href
),当然可以吗?这只是一个
字符串
,因此肯定可以将JSON字符串化。我认为你根本不需要
localStorage
。我不知道Chrome,但是大多数浏览器扩展应该可以打开一个新窗口并用字符串列表填充它,而不必通过任何类型的
localStorage
数据库进行调解。您可以使用后台页面作为控制器,并从那里访问存储的值。请参阅我的新标签重定向的代码以获取示例(我在trunk的代码中使用JSON.stringify)