当前位置: 首页 > 工具软件 > json2html > 使用案例 >

json怎么转为HTML并显示,将JSON显示为HTML

谷梁宝
2023-12-01

关于如何将JSON嵌入到HTML页面中,并将JSON格式化为人类可读的样式,有什么建议吗?例如,在浏览器中查看XML时,大多数浏览器都显示XML格式(缩进、适当的换行符等)。我想要相同的JSON最终结果。

颜色语法突出显示将是一个额外的好处。

谢谢

tohtml.com/javaperties对我来说工作得很好;它使样式"内联";对于简单的复制和粘贴到其他东西非常有用。

查看我的库azimi.me/json-formatter-js

可以将json.stringify函数与未格式化的json一起使用。它以格式化的方式输出它。

JSON.stringify({ foo:"sample", bar:"sample" }, null, 4)

这个转弯了

{"foo":"sample","bar":"sample" }

进入之内

{

"foo":"sample",

"bar":"sample"

}

现在,数据是一种可读的格式,您可以使用@a.levy建议的谷歌代码美化脚本对其进行彩色编码。

值得补充的是,IE7和旧版本的浏览器不支持json.stringify方法。

对于不支持json.stringify的浏览器(让我们来说说,旧的IE),有一个很好的polyfill可以用来获得功能(json.org/js.html)。只要把它包括进去,你就会被覆盖的很广。

另一个技巧是,如果你放一个而不是缩进字段(4),你会得到很好的换行符。

最好的答案是,做好工作,不需要包括第三方图书馆。

我在一个必须在html元素中显示人工格式的JSON的用例中使用了这种方法,效果非常好。似乎做得很好。

它对我不起作用。最后我找到了解决办法。这也许能解决你的问题。这里是:codematrics.com/how-to-display-json-data-in-format

把这个放在

如果您有意为最终用户显示它,请将JSON文本包装在和标记中,例如:

[cc]

[

{

color:"red",

value:"#f00"

},

{

color:"green",

value:"#0f0"

},

{

color:"blue",

value:"#00f"

},

{

color:"cyan",

value:"#0ff"

},

{

color:"magenta",

value:"#f0f"

},

{

color:"yellow",

value:"#ff0"

},

{

color:"black",

value:"#000"

}

]

 类似资料: