Question

我确定在某个地方已经得到了回答，但是我缺乏术语知识，无法找到要去的地方。

由于从服务器加载了一些json数据，我正在动态创建一些Html。

我正在使用createElement和setAttribute创建html并将其附加到主体。

但是，我的动态html包含一个＆＃34;数据 - ＆＃34; attribute，具有进一步嵌套的属性。一个示例最终目标是这样的：

<li>
   <span class=item data-item='{"width": 100, "height": 100, 
    "properties": { "Name": "foo", "Surname": "bar" }}'></span>
</li>

我在跑步时取得了一些成功：

li.setAttribute("data-item", '{"width": 100, "height": 100, "properties": 
                 { "Name": "foo", "Surname": "bar" }}');

但是当我在我的java脚本中的其他地方使用数据项时，属性被识别为字符串而不是对象。当我对HTML进行硬编码时，数据项作为对象正确加载。我已经做出了必须的假设，因为我错误地设置了这个属性。

Answer 1

您正在获取一个字符串，因为该属性设置为字符串，您可以在解析之后将数据作为对象获取，如下所示：

var li = document.createElement('li');
li.id = "li1";
li.setAttribute("data-item", '{"width": 100, "height": 100, "properties": { "Name": "foo", "Surname": "bar" }}');
li.innerHTML = "SAMPLE li";
document.body.appendChild(li);


var data = document.getElementById('li1').getAttribute('data-item');
data = JSON.parse(data);
console.log(data);

Answer 2

您可以使用JSON.parse将其转换为对象：

android {  useLibrary 'org.apache.http.legacy'}

具有嵌套属性的HTML SetAttribute

2 个答案: