數據屬性中的JSON對象

Question

我們可以以某種方式在html數據標記屬性中編寫JSON字符串嗎？

然後在JavaScript中處理它以解析爲正常的JSON對象。

實施例：

HTML

<select class="field" data-select="{"firstname":"Jesper","surname":"Aaberg","phone":["555-0100","555-0120"]}"></select> 

JS

var obj = JSON.parse($('form').find('select').attr('data-select')); 

溶液中使用單引號：

<select class="field" data-select='{"firstname":"Jesper","surname":"Aaberg","phone":["555-0100","555-0120"]}'></select> 

Answer 1

使用JSON.stringify（如果JavaScript）使json成爲一個字符串並將其存儲在data- *字段中。

var json = {"firstname":"Jesper","surname":"Aaberg","phone":["555-0100","555-0120"]}; 
var div = document.getElementById("myDiv"); 
div.setAttribute("data-json", JSON.stringify(json)); 
alert(div.getAttribute("data-json")) 

檢查模板引擎文檔（如果你是你正在使用一個）來生成字符串化的json。

小提琴：需要https://jsfiddle.net/b1tqxhty/