在DOM中存储JSON的最佳做法 [英] Best practices for Storing JSON in DOM

问题描述

我想使用HTML模板渲染一些json数据。

我还没有开始实现任何东西，但是我希望能够将json的数据值设置为包含一个记录的模板的html元素，或者使用一些参数来渲染一些项目的集合，这些参数是每个项目的模板html，而且能够以与用于呈现项目的源JSON相同的格式获得JSON对象（我想要我的初始JSON包含更多关于记录行行为的信息，而不需要做出ajax请求来检查用户是否可以对此记录执行某些操作，并且并不是所有这些信息都可以在模板中显示）。

我知道我可以使用对象的每个属性的输入元素隐藏窗体，并将mapper函数放在JSON中，但是对我来说听起来像是过度的，我不喜欢这样，我想要一些更轻的信封。

我想知道有没有一些JS库可以串行化和反序列化JSON对象到html，所以我可以存储我在DOM的某处（即在元素中包含数据显示，但是我想要存储不需要显示为表单元素的其他属性）？

更新由于第一个建议将JSON存储在全局变量中，我也曾经考虑过，我的最好的精神解决方案是使JavaScript模块（或jQuery插件）将JSON映射到HTML，如果不可能在html中存储值，那么它可以将它们存储在内部变量中，所以当我想从html元素获取数据时，它可以从本地副本中拉出数据。我想知道这是更好的方法吗？如果有一些图书馆将这个信息存储在变量中，但是用html实时地绑定了这些数据，那么我会很高兴。

更新2 现在，使用 http://knockoutjs.com/ 完成此操作，无需再将DOM保存在DOM中， knockout自动执行JSON< => HTML映射

解决方案

为什么不将其存储为自然目的：作为JavaScript对象？ DOM是一个可怕的地方。

这就是说，jQuery具有数据方法只允许这个。

I want to render some json data using HTML template.

I haven't started implementing anything yet, but I would like to be able to "set" values of data from json to html element which contains template for one record, or to render some collection of items using some argument which is template html for each item, but also to be able to get JSON object back in same format as source JSON which was used to render item (I want my initial JSON to contain some more information about behavior of record row, without the need to make ajax request to check if user can or can't do something with this record, and not all of this info is visible in template).

I know that I could make hidden form with an input element for each property of object to store, and mapper function to/from JSON, but it sounds like overkill to me, and I don't like that, I want some lighter "envelope".

I was wondering is there some JS library that can "serialize" and "deserialize" JSON objects into html so I can store it somewhere in DOM (i.e. in element which contains display for data, but I want to be able to store additional attributes which don't have to be shown as form elements)?

UPDATE As first answer suggested storing JSON in global variable, I also have thought about that, and my "best" mental solution was to make JavaScript module (or jQuery plugin) which would do "mapping" of JSON to html, and if not possible to store values in html then it can store them in internal variable, so when I want to "get" data from html element it can pull it from its local copy. I want to know is there better way for this? If there is some library that stores this info in variable, but does real-time "binding" of that data with html, I would be very happy with that.

UPDATE 2 This is now done using http://knockoutjs.com/, no need to keep json in DOM anymore, knockout does the JSON<=>HTML mapping automatically

解决方案

Why not store it as nature intended: as a javascript object? The DOM is a horrible place.

That said, jQuery has the data method that allows just this.

这篇关于在DOM中存储JSON的最佳做法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！