json与xml格式互转是我们日常开发中的常见需求,如何在前端实现这两种格式的转换呢?
这里需要用到两个js插件:ObjTree.js、jkl-dumper.js
话不多说,直接上示例:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN">
<html>
<head>
<title>json与xml互转</title>
<script type="text/javascript" src="js/ObjTree.js"></script>
<script type="text/javascript" src="js/jkl-dumper.js"></script>
</head>
<body>
<div>
<textarea id="xml" rows="20" cols="80" >xml</textarea>
<textarea id="json" rows="20" cols="80">json</textarea>
</div>
<input type="button" value="xml2json" οnclick="fnXml2json()"/>
<input type="button" value="json2xml" οnclick="fnJson2xml()"/>
</body>
</html>
<script>
function fnXml2json(){
//将xml字符串转为json
var xotree = new XML.ObjTree();
var xmlText = document.getElementById("xml").value;
var json = xotree.parseXML(xmlText);
//将json对象转为格式化的字符串
var dumper = new JKL.Dumper();
var jsonText = dumper.dump(json);
document.getElementById("json").value = jsonText;
}
function fnJson2xml(){
var xotree = new XML.ObjTree();
var jsonText = document.getElementById("json").value;
//将json字符串转为json对象后转为xml字符串
var json = eval("(" + jsonText + ")");
var xml = xotree.writeXML(json);
//使用jkl-dumper.js中的formatXml方法将xml字符串格式化
var xmlText = formatXml(xml);
document.getElementById("xml").value = xmlText;
}
</script>
在以上示例中,ObjTree.js用于json与xml两种格式之间的转换,jkl-dumper.js用于将json对象转为格式化的json字符串以及将xml字符串格式化。
js插件下载地址:http://download.csdn.net/detail/u010295919/9749669