Javascript 如何在JSON中添加对HTML元素的引用？

在JSON中有以下引用：

 container: document.getElementById('cy'),

例如

如果我手动创建这个JSON字符串，并对其调用cytoscape（），它就可以正常工作

但是，我从servlet返回了一个JSON字符串，在客户端，我需要添加容器值

我试过：

function updateGraph(json) {
    console.log(json);

    pjson = JSON.parse(json);
    pjson["container"] =  document.getElementById('graph-container');
    json = JSON.stringify(pjson);
    console.log(json);

    cytoscape(json);
}

但这会将容器元素显示为：

"container":{}

添加HTML元素引用的正确方法是什么

document.getElementById('graph-container');

---

将返回嵌入其中的html元素。Javascript对象表示法（JSON）不能包含这样的元素，也就是说，它不能解析这样的元素。它只能保存数组、字符串对象、布尔值对象、数字对象和空值对象。

从注释中可以看出，对于什么是JSON存在很大的混淆。JSON和XML一样，是一种以字符串形式编码数据的方法。这些是JavaScript代码上下文中的有效JSON：

'1'
'"quux"'
'[2, 3, 4]'
'{ "foo": ["bar", "baz"] }'

在JavaScript代码中，这不是JSON：

1
"quux"
[2, 3, 4]
{ "foo": ["bar", "baz"] }

第一个是整数，第二个是字符串，第三个是数组，第四个是对象。显然，文件是保存的字符串数据，因此JSON文件不会像我们在代码中看到JSON那样被引号包围

因此,

使用对象而不是JSON调用

cytoscape

。如果用JSON来调用它，它会这样调用它：

cytoscape('{ ... }')

JSON只支持有限数量的类型；DOM元素不在其中。同时，您可以将任何JavaScript值填充到对象属性中：

var obj = {
  sum: 1 + 2,
  diff: 1 - 2
};

---

执行此操作时，

obj

将包含

sum:3

和

diff:-1

。类似地，当解析问题中的对象文本时，

container

属性将包含一个DOM元素。JSON不是可执行的，不能调用JS函数。

JSON中只能表示文字，属性名称始终是双引号字符串，因此您的示例：

container: document.getElementById('cy'),

不是有效JSON对象的一部分

JSON对象可以包含以下内容：

"container-id": "cy",

---

显然，在JSON.parse之后需要进行后期处理才能检索DOM元素。

JSON只能保存普通的JS对象、数组、字符串、数字、布尔值和空值。元素引用不能用JSON表示。你到底希望它严格化为什么？将

pjson

传递给cytoscape，但不进行字符串化，否？@Amadan-那么引用如何在原始JSON中工作？这不是JSON，而是JS代码中的对象文字。您的

pjson

是一个对象文字，正是您所需要的。@Amadan将其作为对象文字传递解决了这个问题。不过我不太明白。如果JSON只能保存数组、字符串、数字等。。。那么，为什么包含非结构化的

document.getElement…

会起作用呢？因为这不是JSON，而是对象文字。JSON:

“{foo:“bar”}”

。JS对象：

{“foo”：“bar”}

。请注意引号-JSON始终是一个字符串。对象文字是可执行的JS代码，与（var i=9；i；i--）的

console.log（7）

和

for相同-
document.getElement…
在对象文本求值时执行
var result={“sum”：1+2}
JS代码是否与您的代码相当<代码>'{“sum”：1+2}'

是字符串，无效的JSON（

'{“sum”：3}'

是有效的JSON）。

container: document.getElementById('cy'),

"container-id": "cy",