文档章节

HTML显示json字符串并且进行格式化

writeademo
 writeademo
发布于 08/17 18:15
字数 165
阅读 26
收藏 0

通过pre标签进行格式化展示,使用JSON.stringify()方法转换。

代码如下:

 

 
  1. <html>

  2.  
  3. <head>

  4. <title>HTML显示json字符串并且进行格式化</title>

  5. </head>

  6.  
  7. <body>

  8. <p id="show_p">{ "name": "Brett", "address":"北京路23号", "email": "123456@qq.com" }</p>

  9. <pre id="out_pre"></pre>

  10.  
  11. </body>

  12. <script type="text/javascript">

  13.  
  14.   var text = document.getElementById('show_p').innerText; //获取json格式内容

  15.  
  16. var result = JSON.stringify(JSON.parse(text), null, 2);//将字符串转换成json对象

  17.  
  18. document.getElementById('out_pre').innerText= result ;

  19.   

  20.  
  21. </script>

  22.  
  23. </html>

© 著作权归作者所有

共有 人打赏支持
writeademo
粉丝 23
博文 516
码字总数 188548
作品 0
东城
Navi.Soft31.开发工具(含下载地址)

1系统简介 1.1功能简述 在软件开发过程中,我们需要经常对字符串、文件、数据库操作。有时需要浏览Json格式串,有时需要浏览Xml格式串,有时需要读取txt或excel文件,有时需要对数据库访问。本...

小特工作室
2017/11/02
0
0
PHP中String字符串处理函数完整版

文章来源:PHP开发学习门户 我的原创地址:http://www.phpthinking.com/archives/602 开发习惯常用字符串处理函数梳理: strtr() 转换字符串中特定的字符。 substr() 返回字符串的一部分。 ...

PHP开发学习门户
2014/10/16
0
0
leo108/jsonFormater

JsonFormater 基于jQuery的json格式化、高亮库 核心代码参考天马行空工作室,本人只做了模块化和一些代码优化。 demo http://leo108.github.io/jsonFormater/ 使用方式 引入jQuery 注意:jQu...

leo108
2014/06/24
0
0
飘逸的python - 命令行漂亮的显示json数据

之前做的一个脚本把信息用json格式存到文本中。这样的好处是简便,易编辑,并且拥有强大的表达能力。 不过从文本cat出来的是一堆很难看的字符串,没换行和缩进。这时候就在想,如果有个类似于...

长平狐
2013/08/21
450
0
jquery的json插件jquery-json.js

// 引用库文件 jquery.json-2.2.js; 下载地址:https://github.com/zwjjap/jquery-json 该插件用于javascript对象(数组、对象、数字、字符串)为JSON格式,或者 把格式化后的JSON数据转化回...

zwjjap
2016/03/18
265
0

没有更多内容

加载失败,请刷新页面

加载更多

jQuery学习笔记180924

jQuery - AJAX 简介 什么是 AJAX? AJAX = 异步 JavaScript 和 XML(Asynchronous JavaScript and XML)。 简短地说,在不重载整个网页的情况下,AJAX 通过后台加载数据,并在网页上进行显示...

颖伙虫
18分钟前
1
0
springboot整合vue小试牛刀

序 本文主要研究一下如何在springboot工程整合vue maven <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-we......

go4it
19分钟前
1
0
使用python的profiler工具

主要用来检测python coding的执行时间 fly profiler

steel7c4
24分钟前
0
0
大数据日知录笔记

硬件成本的快速下降,使得电子设备的无处不在成为可能,数据无处不在,无时不在. IBM用3V(Volume,Velocity,Variety)来描述大数据的特点,后来又增加了Value这个维度,即价值密度低的数据成为大数据...

凌渡
33分钟前
0
0
IDEA、WebStorm最新永久激活方式

今天早上一大早打开IDEA发现激活已过期,遂开始寻找激活码。但是一直不成功,后来终于找到一种比较靠谱的激活方式。在此记录下来,以备不时之需。 目前网上现有的激活方式大概有这么三种 激活...

耒耒耒耒耒
今天
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部