<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>js实现xml转json和json转xml</title>

    <style type="text/css">

        html,body{width:%;height:%;margin:;}

    </style>

</head>

<body>

      <textarea id="xml" style="width:45%;height:700px;"></textarea>

      <textarea id="json" style="width:45%;height:700px;"></textarea>

      <button id="tojson">xml转json</button>

      <button id="toxml">json转xml</button>

</body>

</html>

<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script>

<script type="text/javascript" src="http://www.jsons.cn/Down/jquery.json2xml.js"></script>

<script type="text/javascript" src="http://www.jsons.cn/Down/jquery.xml2json.js"></script>

<script type="text/javascript">

//参考链接：http://www.jsons.cn/articleinfo/8/

 $(function(){

  $("#tojson").click(function(){

    var str=$("#xml").val();

    var json_obj = $.xml2json(str);

    console.log(json_obj);

    $("#json").val(JSON.stringify(json_obj));

  });

  $("#toxml").click(function(){

    var str=$("#json").val();

    str=JSON.parse(str);

    var xml_content = $.json2xml(str);

    console.log(xml_content);

    $("#xml").val(xml_content);

  });

 });

</script>

JsonToHtml的更多相关文章

  1. js生成有缩进的表格

    项目中用到用了两天时间想到的,记录下来,如有更好的方法,留言给我,谢谢! js做如下表格: json [{"id":302,"serviceId":15,&qu ...

  2. webview与JS的交互

    webview与JS的交互 一:hybird app, web app 和 native app 的区别   Web App Hybird App 混合Native App 开发成本 低 中 高 维护 ...

  3. 【JS】jquery展示JSON插件JSONView

    JSONView介绍 jQuery插件,用于显示漂亮的JSON. 官网地址:https://plugins.jquery.com/jsonview/ git地址:https://github.com/ ...

随机推荐

  1. ocx控件针对网页刷新和关闭分别进行区分处理

    当ocx加载在网页上时,如果对网页执行F5刷新事件,ocx控件会销毁ocx的窗口类,但是ocx的APP类是不会销毁的. 只有当网页被关闭时,才销毁app类. --------------------- ...

  2. MongoDB安全加固方案，防止数据泄露被勒索

    早上起来,发现生产数据库被删了,留下一个数据库名叫“PLEASE_READ”,里面内容如下: "Info" : "Your DB is Backed up at our ...

  3. linux进行Java开发环境的部署

    一.前言: 今天正式向linux开发进攻了,其中遇到一些问题简单的记录一下,为之后的再次部署提供方便. 二.linux的Java8安装的两种方法: 1.源安装很简单,一个命令搞定. sudo apt- ...

  4. 安装express.js(NODEJS框架)

    express.js是nodejs的一个MVC开发框架,并且支持jade等多种模板.下面简单来说说express的安装和app.js文件的配置,然后在今后的教程中一步一步使用express.js搭建个 ...

  5. myeclipse，eclipse设置编码格式的4种情况，以及遇见部分问题的解决办法。

    (1).设置myeclipse工作空间的编码格式,作用范围最大 window-->preference-->general-->workspace-->text file en ...

  6. Codeforces 1142D Foreigner (DP)

    题意:首先定义了一种类数(标志数) 1:1到9都是标志数. 2:若x / 10是标志数,假设x /10在标志数中的排名是k, 若x的个位数小于k % 11, 那么x也是标志数. 现在给你一个字符串,问 ...

  7. cv 验证

    This is how I have trained a xgboost classifier with a 5-fold cross-validation to optimize the F1 sc ...

  8. 数据库 MySQL 之 基本概念

    数据库 MySQL 之 基本概念 浏览目录 概述 数据库的特点 数据库的分类 选择MySQL的理由 & MariaDB 介绍 下载及安装 SQL介绍 一.概述 1.数据(data) 存储在表中 ...

  9. Requests接口测试(三)

    一.定制请求头 我们先来看一下,关于请求头的定制演示,相信了解http协议的小伙伴应该对请求头部headers请求头部并不陌生,那么作为实际工作中的我们,如果想自定义一些请求头的信息,我们应该怎么办呢 ...

  10. 再次迷宫救人——BFS

    原创 上次用DFS解了迷宫救人:https://www.cnblogs.com/chiweiming/p/9313164.html 这次用BFS(广度优先搜索),实现广度优先搜索比深度优先搜索复杂,思 ...