背景
最近工作中发现一些接口居然还在使用XML格式传递数据，用于一个表单数据。我需要先完成如下步骤：
- 解析xml获得数据后显示在表单中；
- 用户编辑后，调用接口前，还得转为xml格式；
- 将上述的XML数据转为字符串，返回给后端；
无奈后端大大不愿帮我转JSON，只能自己上手，偶然发现原生就解析的API，下面是简单的使用介绍。
解析XML
介绍一个JS原生的API-DOMParser。 简单的说DOMParser是一个类，通过new关键字调用后，返回一个parser。后续的解析工作由这个parser完成：
js
const xmlStr = '<AAAA id="a" name="AAA"><BBB id="b">hey!</BBB></AAAA>';
const parser = new DOMParser();
const doc = parser.parseFromString(xmlStr, "application/xml");写到这里大家脑海中可能会有一个疑问-怎么获取XML的数据呢？要解决这一个问题，需要先看看parseFromString返回是什么呢？
答案是一颗DOM树。如下图所示：
这里请允许我吐槽一下这个API的设计：new DOMParser -> parser -> parser.parseFromString，需要经过这么多步才能完成解析。。。
这是不是意味着我们可以通过熟悉的API去获取值了呢？下面简单尝试一下：
查询querySelector
注意：querySelector方法需要在parseFromString返回的DOM上调用，才能查到节点。
获取属性 getAttribute
就目前为止，DOM相关的API基本都能使用。如此就能根据实际需要将这颗DOM树转化为普通的JS对象了。本人实力有限，怕误导大家，就不贴代码了。
创建一颗XML版的DOM树
上面提到parser返回的是一颗，那么是不是用传统创建Element元素的API就行了呢？
经过实际检验发现HTML会忽略大小写。
OS:当初写到这步的时候，我的心是拔凉拔凉的。以为自己好不容易发现的新大陆，其实是一个死胡同。但是我突然灵光一现，意识到了一个问题
大家还记上面调用查询API的时候，是没有使用全局的document的。那么在这里我重新创建一个document对象，并通过它创建大写开头的标签是否可行呢？
惊不惊喜，意不意外。那这是为什么呢？
这个问题我们可以通过 document.contentType 来简单解答一下
MDN的解释：返回当前文档的 Content-Type(MIME) 类型。
具体原因后续如果我能找到，咱们再聊聊。
现在我们还需要把处理属性值和子节点
到目前为止，我们就剩最后一步-将xml树转化为字符串 这里介绍第二个API-XMLSerializer，具体使用见下面：
总结
本篇文章主要从我在工作中遇到的一个小问题-解析并序列化XML数据开启，简单分享了一下如何使用原生API，自由的处理xml数据。虽然现在有许多第三方库可以很方便的帮助我们解决上述问题，但是在面对一些需要特殊处理的情况时，相比于修改三方库代码，可能我分享的这种方式更容易实现。