JS - 实现XML与JSON数据的相互转换（使用xml2json.js）

2017-09-30 发布：hangge 阅读：24918

一、基本介绍

1，x2js 介绍

x2js 是一个可以将 XML 数据转换成 JSON 对象，或者将 JSON 对象转成 XML 数据的的 JavaScript 库。它体积小巧，使用简单，而且不依赖任何其他的库。

2，安装配置

（1）首先到其 GitHub 主页下载库代码。

地址：https://github.com/abdmob/x2js

（2）然后在需要使用页面上将其引用进来即可。

<script type='text/javascript' src="xml2json.js"></script>

二、将 XML 转为 JSON

1，将 XML 字符串转换为 JSON 对象

//待转换的xml字符串
var xmlText = "<data id='123'><test>success</test><result>hangge.com</result></data>";

//创建一个x2js对象进行转换
var x2js = new X2JS();
var jsonObj = x2js.xml_str2json( xmlText );

//输出结果
console.log(jsonObj);

2，XML 属性值的访问

使用 x2js 转换时，原先 xml 节点上的属性名会自动添加一个下划线前缀（_），然后作为 json 对象的一个属性。
比如我们要获取原来 data 节点上的 id 这个属性值：

console.log(jsonObj.data._id);

3，修改默认的属性名前缀

（1）如果觉得默认添加的下划线前缀不好，可以通过 attributePrefix 配置项进行修改。

//待转换的xml字符串
var xmlText = "<data id='123'><test>success</test><result>hangge.com</result></data>";

//创建一个x2js对象进行转换
var x2js = new X2JS({
    attributePrefix : "$"
});
var jsonObj = x2js.xml_str2json( xmlText );

//输出结果
console.log(jsonObj);

（2）上面我们将默认前缀修改成“$”，转换后的结果如下：

4，处理并解析 XML 中的时间值

（1）比如我们有如下 xml 字符串需要转换，其中包含有时间值。

var xmlText = "<MyDts><testds>2002-10-10T12:00:00+04:00</testds></MyDts>";

（2）如果想要正确获取时间，有如下两种办法：

转换前预先进行配置：

var x2js = new X2JS({
     datetimeAccessFormPaths : [
        "MyDts.testds"
     ]
});

var jsonObj = x2js.xml_str2json(xmlText);

console.log(jsonObj.MyDts.testds);

转换后通过 x2js 的 asDateTime 方法进行解析：

var x2js = new X2JS();
var jsonObj = x2js.xml_str2json(xmlText);

console.log(x2js.asDateTime(jsonObj.MyDts.testds));

（3）运行结果如下：

5，将 AJAX 请求结果转为JSON对象

这里以 jQuery 为例，将通过 AJAX 请求的 XML 数据转换成 JSON 对象。

$.ajax({
    type: "GET",
    url: "/test",
    dataType: "xml",
    success: function(xmlDoc) {
        var x2js = new X2JS();
        var jsonObj = x2js.xml2json(xmlDoc);
    }
});

6，读取 XML 文件并将内容转换为 JSON 对象

function loadXMLDoc(dname) {
    if (window.XMLHttpRequest) {
        xhttp=new XMLHttpRequest();
    }
    else {
        xhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xhttp.open("GET",dname,false);
    xhttp.send();
    return xhttp.responseXML;
}

var xmlDoc = loadXMLDoc("test.xml");
var x2js = new X2JS();
var jsonObj = x2js.xml2json(xmlDoc);

三、将 JSON 转为 XML

1，将 JSON 对象转换为 XML 字符串

//待转换的json对象
var jsonObj = {
   MyRoot : {
        test: 'success',
        test2 : {
            item : [ 'val1', 'val2' ]
        }
    }
};

//创建一个x2js对象进行转换
var x2js = new X2JS();
var xmlAsStr = x2js.json2xml_str(jsonObj);

//输出结果
console.log(xmlAsStr);

2，转换为 xml 的属性值

（1）默认情况下，JSON 对象里那些以下划线（_）开头的属性，都会被转为 XML 节点的属性（转换后会去除下划线）

//待转换的json对象
var jsonObj = {
   MyRoot : {
        test: 'success',
        _test2 : 'hangge.com'
    }
};

//创建一个x2js对象进行转换
var x2js = new X2JS();
var xmlAsStr = x2js.json2xml_str(jsonObj);

//输出结果
console.log(xmlAsStr);

（2）如果不喜欢“_”这个前缀，可以通过 attributePrefix 配置项进行修改。下面代码运行结果同上面的是一样的。

//待转换的json对象
var jsonObj = {
   MyRoot : {
        test: 'success',
        $test2 : 'hangge.com'
    }
};

//创建一个x2js对象进行转换
var x2js = new X2JS({
    attributePrefix : "$"
});
var xmlAsStr = x2js.json2xml_str(jsonObj);

//输出结果
console.log(xmlAsStr);

四、配置项介绍

初始化 X2JS 对象时可以进行一些默认配置的修改，比如上面代码中我们把属性前缀修改成“$”。

var x2js = new X2JS({
    attributePrefix : "$"
});

下面列举了所有的配置项，大家可以根据需求来使用：

escapeMode：是否转义 XML 字符（默认值：true）
attributePrefix：XML 属性在 JSON 对象中自动添加的前缀（默认值：_）
arrayAccessForm：通过这个配置可以让所有的 XML 元素增加一个_asArray 属性，以便通过数组形式访问。（可选值：none | property。默认值：none）
emptyNodeForm：如何处理空节点。设置为 text（默认值）：解析为空字符串（""）。设置为 object：解析为空对象（{}）
enableToStringFunc：在生成 JSON 对象时是否启用打印带有 text/cdata 的文本节点的功能。（默认值：true）
arrayAccessFormPaths：[] - 数组访问路径 - 使用此选项可以始终以“数组形式”配置 XML 元素的路径。您可以根据 XSD 或您的知识，预先将路径配置到所有阵列元素。每个路径都可以是一个简单的字符串（如“parent.child1.child2”），正则表达式（如 /.*.child2/）或自定义函数。（默认为空）
skipEmptyTextNodesForObj：跳过带有子节点的节点的空文本标签。（默认值：true）
stripWhitespaces：去除空白，即 trimming 文本节点。（默认值：true）
datetimeAccessFormPaths：[] - DateTime 访问路径。使用此选项为 XML datetime 元素配置 XML 元素的路径。您可以根据 XSD 或您的知识，预先为所有 datetime 元素配置路径。每个路径都可以是一个简单的字符串（如“parent.child1.child2”），正则表达式（如 /.*.child2/）或自定义函数。（默认为空）
useDoubleQuotes：使用双引号输出 XML 格式。（默认值：false）
xmlElementsFilter：[] - 过滤传入的 XML 元素。您可以传递一个带格式的路径（如“parent.child1.child2”），正则表达式或函数。（默认为空）
jsonPropertiesFilter：[] - 过滤输出 XML 的 JSON 属性。您可以传递一个带格式的路径（如“parent.child1.child2”），正则表达式或函数。（默认为空）
keepCData：如果此属性定义为 false，并且 XML 元素仅具有 CData 节点，则将其转换为文本而不附加属性“__cdata”。（默认值：false）