javascript - 是否可以以某种方式将 JSON 对象直接存储到 DOM 中？

Question

如果手头有 JSON.parse 的输出，是否有某种合法的方式将该对象作为单个实体存储在 DOM 中？

IE

jsonObject = JSON.parse(something);

我想考虑将 jsonObject 作为某个元素的 (child || textNode || ???) 存储在 DOM 中，然后检索它，以便在检索后立即可以通过通常的方式访问它的内容：

jsonObject.keyName

我想避免添加几十个数据集属性，然后被迫一次提取一个。如果你有几十个键：值对，那工作量太大而且效率似乎太低。

score 4 · Accepted Answer

数据属性必须是字符串，不能直接在其中存储对象。所以不用解析 JSON 字符串，直接将 JSON 字符串存储在 dataset 属性中即可。

如果你使用 jQuery，它的.data()方法会接受一个对象，并且它会根据需要自动对它进行字符串化。

如果要关联对象的所有元素都有 ID，另一种选择是使用全局对象作为表，以元素的 ID 为键。

jsonTable[id] = jsonObject;

score 1 · Accepted Answer

这取决于页面的生命周期。如果您不打算重新加载页面，最好将其作为 JavaScript 变量保留在页面上。

您还可以考虑将原始 JSON 存储在隐藏文件或其他一些隐藏的 DOM 元素中。请记住，如果您发布页面，隐藏字段将发布到服务器

score 1 · Accepted Answer

TGH 有正确的答案。将其保留为变量。

另一种方法是使用 history.pushState() 将其与页面的 URL 一起存储。如果您希望用户能够单击后退按钮并将 json 恢复为该页面的值，这将很有帮助。

score 0 · Accepted Answer

如果要存储与 DOM 元素关联的数据 (JSON)。

例如，将 JSON 存储到餐厅行 (div)

$("div.restaurant-row").data("info",{purchases: "blablabla", mealFormulas: "xxxxx"});

例如，获取 DOM 关联数据

$("div.restaurant-row").data("info").purchases;    //blablabla

我不确定这是否是你想要的。

希望这对你有帮助。

4 回答 4