基于javascript的JSON格式頁面展示美化方法
更新時間：2014年07月02日 16:42:16 投稿：whsnow
本文介紹的方法基于javascript，css和myFunction結(jié)合可實現(xiàn)頁面展示轉(zhuǎn)換，下面有個示例，大家可以參考下
{"name": "monkey","age": "24","height": 164.0}
如果想讓以上json字符串在頁面上展示的比較易讀，即變成下面的style:
{
"name": "monkey",
"age": "24",
"height": 164.0cm
}
本文介紹的方法基于javascript ，代碼如下：
<html>
<head>/
//style中是css代碼
<style type="text/css">
body
{
white-space: pre;
font-family: monospace;
}
</style>
//script中是javascript代碼
<script>
window.error_id_msgs = <%= error_id_msgs | raw %>;
function myFunction() {
document.body.innerHTML = "";
document.body.appendChild(document.createTextNode(JSON.stringify(window.error_id_msgs, null, 4)));
}
</script>
</head>
<body onload="myFunction()"> //表示頁面加載時調(diào)用myFunction()
</body>
</html>
其中window.error_id_msgs是所要轉(zhuǎn)換的json對象，css和myFunction結(jié)合可實現(xiàn)頁面展示轉(zhuǎn)換
相關(guān)文章
詳解JavaScript數(shù)組和字符串中去除重復(fù)值的方法
這篇文章主要介紹了詳解JavaScript數(shù)組和字符串中去除重復(fù)值的方法,及利用各種限制條件對數(shù)組和字符串進行過濾,需要的朋友可以參考下2016-03-03
詳解JavaScript的Symbol類型、隱藏屬性、全局注冊表
這篇文章主要介紹了JavaScript的Symbol類型、隱藏屬性、全局注冊表,本文主要對其使用方法和使用場景做個簡單的介紹，需要的朋友可以參考下2022-05-05
編寫JS的過程中,我們經(jīng)常用到對象,也會用到對象中的屬性,下面這篇文章主要給大家介紹了關(guān)于JS判斷對象屬性是否存在的五種方案,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下2022-01-01
javascript實現(xiàn)鼠標(biāo)拖動改變層大小的方法
這篇文章主要介紹了javascript實現(xiàn)鼠標(biāo)拖動改變層大小的方法,涉及javascript操作鼠標(biāo)事件及樣式的相關(guān)技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-04-04
layui 實現(xiàn)二級彈窗彈出之后 關(guān)閉一級彈窗的方法
今天小編就為大家分享一篇layui 實現(xiàn)二級彈窗彈出之后 關(guān)閉一級彈窗的方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09
這篇文章介紹了js簡單實現(xiàn)用戶注冊信息的校驗代碼，有需要的朋友可以參考一下2013-11-11
(跨瀏覽器基礎(chǔ)事件/瀏覽器檢測/判斷瀏覽器)經(jīng)驗代碼分享
一些js代碼，自己備用的,高手不要笑話我。（跨瀏覽器基礎(chǔ)事件，瀏覽器檢測，判斷瀏覽器的名稱、版本號、操作系統(tǒng)）等等，很實用的，方便自己使用，感興趣的朋友可以了解下，希望本文對你有所幫助2013-01-01
接觸和學(xué)習(xí)javascript也有3~4年了，真正牽扯到前后臺數(shù)據(jù)的交互，數(shù)據(jù)算法等高級編程知之甚少，甚至很少用，如果你問我你知道js什么知識呢？我可能只能說知道點jQuery的技巧，說編程都談不上，所以需要把某一些技巧作為編程習(xí)慣固定下來，免于以后有人問我你知道什么？2015-04-04
JavaScript函數(shù)調(diào)用經(jīng)典實例代碼
JavaScript提供了4種函數(shù)調(diào)用,一般形式的函數(shù)調(diào)用、作為對象的方法調(diào)用、使用 call 和 apply 動態(tài)調(diào)用、使用 new 間接調(diào)用,下面這篇文章主要給大家介紹了關(guān)于JavaScript函數(shù)調(diào)用的相關(guān)資料,需要的朋友可以參考下2021-12-12
感覺很流暢的js實現(xiàn)的鍵盤控制（帶慣性）...2007-06-06