Json到Html（沒有第三方庫）

Question

我是JSON的初學者，我對此很困惑。

我必須將任何有效的JSON字符串轉換爲有效的HTML字符串，才能在Web上可視化JSON。

jsonToHtml(「[{‘x’: 1, ‘b’: 2}, {‘x’: 100, ‘b’: 200}]") => 「x:1x:100" 

謝謝你們。

Answer 1

首先，您的單引號和雙引號字符存在一些問題。它看起來可能是一個複製和粘貼問題。您所展示的JSON是創建對象數組的可接受語法，只需刪除包裝雙引號即可。

使用Chrome的JavaScript控制檯粘貼以下：

var myVar = [{'x': 1, 'b': 2}, {'x': 100, 'b': 200}] 
// myVar now contains an array of the two objects. 
// Test it out by attempting to access one of the objects properties. 
myVar[0].b 

UPDATE

如果目標瀏覽器支持的ECMAScript 5，您可以使用本機JSON.parse功能。

// Your JSON 
var myJson = '[{"x": 1, "b": 2}, {"x": 100, "b": 200}]'; 
// Call our handy function that parses the JSON and set our variable with the parsed results. 
var parsedObject = parseJson(myJson); 
function parseJson(json) { 
    return JSON.parse(json); 
} 

Answer 2

什麼this one：基於this post

function htmlEscape(str) { 
    return String(str) 
      .replace(/&/g, '&') 
      .replace(/"/g, '"') 
      .replace(/'/g, ''') 
      .replace(/</g, '&lt;') 
      .replace(/>/g, '&gt;'); 
} 

var jsonString = "[{‘x’: 1, ‘b’: 2}, {‘x’: 100, ‘b’: 200}]"; 
var htmlString = htmlEscape(jsonString); 

。