javascript - chrome扩展存储api不会设置数组

Question

所以我正在开发一个 Chrome 扩展程序并利用存储 API here 。 据我所知，我能够存储 JS 对象和数组。

我有一段代码:

chrome.storage.sync.get(["fflist", "signature", "quote", "avatarHide", "ads", "tweet", "filters", "vine", "webm", "cats", "main", "tree", "embedTweet"],function (obj){
    g = obj;

   //all my functions and code are wrapped inside here, the rest of the options      
   //returned inside g are either primitives (booleans) and I have one object. 

    var t = g.fflist
    t.push(a[0])
    console.log(t)
    chrome.storage.sync.set({"fflist": t},function (){
    });
    console.log(g.fflist[0])
});

a[0]是一些我知道不是空的 jQuery 对象，并且是我想要的。`

现在，console.log(g.fflist[0]) 的输出显示g.fflist[0]具有我想要存储的正确值。如<tr class="forum forum_268">..</tr>

然后我重新加载页面。突然，当我记录 console.log(g.fflist[0]) 的输出时它似乎只是一个空物体，Object {} 没有任何意义为什么

更新:解决方案

我非常愚蠢地认为我可以在存储缓存中存储 DOM 对象或 jQuery 对象。但是用blunderboys的注释结合下面的代码再次找到类；

    var geg = new RegExp("forum ([a-zA-Z0-9_]+)")
    var g = geg.exec(thing)
    if (g!=null){
        $("#favouriteForums").after($("."+g[1]))
     }

哪里thing是我存储在存储中的类名属性。

由于我无法存储对这些元素的更改，只能引用原始元素，因此我现在需要即时重现更改，但这应该不会太困难

Answer 1

正如您的文章中提到的，您正在尝试将 jQuery 对象保存在 Chrome 存储区域中。您需要了解对象、数组和类数组对象之间的区别。

jQuery 对象只是 HTML DOM 元素的包装器，并且它只是一个引用。

您可能希望将元素的选择器存储在 Chrome 存储区域中，然后使用该选择器再次获取该元素。

以下是您可以执行此操作的方法:

chrome.storage.sync.get(["fflist", "signature", "embedTweet"],function (obj){
    g = obj;

   //all my functions and code are wrapped inside here, the rest of the options      
   //returned inside g are either primitives (booleans) and I have one object. 

    var t = g.fflist || [];
    // Add selector of a into t
    t.push('.my-class-selector'); //Selector is a string
    console.log(t);
    chrome.storage.sync.set({'fflist': t}, function (){ });
    console.log(g.fflist[0]);
});

要取回元素，可以使用 $(g.fflist[0]);