<!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. SpringMVC总结一：快速入门

    MVC: MVC是一种架构模型,本身没有什么功能,只是让我们的项目结构更加合理,流程控制更加清晰,一般包含三个组件: ​ **Model(模型)**:数据模型,用于提供要展示的数据.一般包含数据和行为 ...

  2. rsync 服务器架设方法

    作者: 北南南北 来自:Linuxsir.Org 摘要: rsync 是一个快速增量文件传输工具,它可以用于在同一主机备份内部的备分,我们还可以把它作为不同主机网络备份工具之用.本文主要讲述的是如何自 ...

  3. 使用百度翻译的API接口

    http://api.fanyi.baidu.com/api/trans/product/desktop 这是申请的接口地址,会得到一个APPID和一个钥密 然后下载PHP的对应的代码 有一个PHP文 ...

  4. 【总结整理】面试pm常见的问题---摘自《人人都是产品经理》

    求职路上,“怼”来“怼”去的面试问题 人人都是产品经理社区 发布于 2018-10-29 19:53:06 举报 阅读数:1418 ​​在求职路上,面对那些被“怼”到过的面试问题,应该如何处理? 一个 ...

  5. jdbc中Statement和PreparedStatement有什么区别？哪个性能更好？

    Statement和PreparedStatement的功能主要是对sql语句的执行 区别 (1)Statement每执行一条sql语句就需要生成一条执行计划,执行100条就需要100条执行计划Pre ...

  6. 通过event事件来控制红绿灯通行车辆

    事件的初始值为False,所以最开始就是红灯,先模拟红绿灯的规律,设定为每两秒变换一次灯,然后再模拟车辆通行,通过事件来将两者的事件结合起来, 当事件为False时,为红灯,车辆处于等待状态,一直wa ...

  7. javascrip总结12:逻辑运算符与等号运算符

    1 逻辑运算符 逻辑运算的结果只有true 或者 false. 1.1 与&&: 两个表达式为true的时候,结果为true. 1.2 或|| 只要有一个表达式为true,结果为tru ...

  8. idea无法下载源码（Cannot download sources）

    有网上说,在命令行项目根目录下,执行如下命令下载: mvn dependency:resolve -Dclassifier=sources 我试着没有效果. 但是在本地仓库中,找到要下载的目录,删除以 ...

  9. MongoDB整理笔记の减少节点

    当应用的压力小时,可以减少一些节点来减少硬件资源的成本:总之这是一个长期且持续的工作. 下面将刚刚添加的两个新节点28013 和28014 从复制集中去除掉,只需执行rs.remove 指令就可以了, ...

  10. Topshelf + Quartz2.5 创建基于windows服务

    1.创建一个定时调度Quartz类 using Quartz; using Quartz.Impl; using System; using System.Collections.Generic; u ...