json数据格式化展示出来
生活随笔
收集整理的這篇文章主要介紹了
json数据格式化展示出来
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
今天有一個(gè)前公司的同事，請(qǐng)教我一個(gè)問題。他問我，怎么將一個(gè)JSON格式的數(shù)據(jù)，格式化以后展示出來。我想了想，于是乎寫出了這個(gè)東西。
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>JSON格式化后展示</title><script src="https://cdn.bootcss.com/vue/2.5.17-beta.0/vue.min.js"></script> </head> <body></body> <script>//執(zhí)行一個(gè)組件 window.onload = function(){var data = {"extendId": "string","objectCode": "string","objectType": 0,"mayouchen":{"name":"youchen","age":25,"sex":"man"}};var jsonData = JSON.stringify(data, null, 4);alert(jsonData);console.log(jsonData); } </script></html>上面這個(gè)代碼直接運(yùn)行就可以看到效果，這里最重要的就是 var jsonData = JSON.stringify(data, null, 4);這里的data就是你傳入的JSON數(shù)據(jù)，效果看下圖：
總結(jié)
以上是生活随笔為你收集整理的json数据格式化展示出来的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： react组件嵌套
- 下一篇： 原生js制作页面长时间未操作退出登录