在前端开发中，经常需要处理XML格式的数据，很多场景下XML数据是以字符串形式返回的，这就需要先将JS字符串转换成XML对象，再进行后续的使用操作。下面详细介绍具体的实现方法和操作步骤。
JS字符串转XML的实现方式
使用DOMParser转换
现代浏览器都支持DOMParser API，这是最常用且兼容性较好的转换方式，它可以把字符串解析为XML文档对象。
// 待转换的XML格式字符串
const xmlString = `<?xml version="1.0" encoding="UTF-8"?>
<user>
<name>张三</name>
<age>25</age>
<hobby>编程</hobby>
</user>`;
// 创建DOMParser实例
const parser = new DOMParser();
// 解析字符串为XML文档，第二个参数指定解析类型为text/xml
const xmlDoc = parser.parseFromString(xmlString, 'text/xml');
// 检查是否存在解析错误
const parseError = xmlDoc.getElementsByTagName('parsererror');
if (parseError.length > 0) {
console.error('XML解析失败：', parseError[0].textContent);
} else {
console.log('XML解析成功，文档对象为：', xmlDoc);
}兼容IE的旧方式
如果需要兼容旧版IE浏览器，可以使用ActiveXObject来实现转换，不过现在这种场景已经比较少，仅作了解即可。
function parseXMLString(xmlString) {
let xmlDoc;
if (window.DOMParser) {
// 现代浏览器使用DOMParser
const parser = new DOMParser();
xmlDoc = parser.parseFromString(xmlString, 'text/xml');
} else if (window.ActiveXObject) {
// IE旧版本使用ActiveXObject
xmlDoc = new ActiveXObject('Microsoft.XMLDOM');
xmlDoc.async = false;
xmlDoc.loadXML(xmlString);
} else {
throw new Error('当前环境不支持XML解析');
}
return xmlDoc;
}转换后XML的使用方法
读取XML节点内容
转换得到XML文档对象后，可以使用DOM操作的方法读取节点内容，常用的有getElementsByTagName、querySelector等方法。
// 承接上面的xmlDoc对象
// 获取name节点的内容
const nameNode = xmlDoc.getElementsByTagName('name')[0];
const userName = nameNode.textContent;
console.log('用户姓名：', userName); // 输出：用户姓名：张三
// 使用querySelector获取age节点的内容
const ageNode = xmlDoc.querySelector('age');
const userAge = ageNode.textContent;
console.log('用户年龄：', userAge); // 输出：用户年龄：25修改XML节点内容
可以直接修改XML节点的文本内容和属性，修改后的对象仍然是有效的XML文档结构。
// 修改hobby节点的内容
const hobbyNode = xmlDoc.getElementsByTagName('hobby')[0];
hobbyNode.textContent = '阅读';
// 新增一个节点
const emailNode = xmlDoc.createElement('email');
emailNode.textContent = 'test@ipipp.com';
// 获取根节点user，将新节点追加到根节点下
const rootNode = xmlDoc.getElementsByTagName('user')[0];
rootNode.appendChild(emailNode);
// 查看修改后的hobby内容
console.log('修改后的爱好：', xmlDoc.getElementsByTagName('hobby')[0].textContent); // 输出：修改后的爱好：阅读将XML对象转回字符串
如果处理完成后需要把XML对象转回字符串格式，可以使用XMLSerializer来实现。
const serializer = new XMLSerializer();
const newXmlString = serializer.serializeToString(xmlDoc);
console.log('转换回的字符串：', newXmlString);
// 输出内容包含修改后的节点信息常见问题注意事项
- XML字符串必须符合规范的XML语法，标签要闭合，属性值要有引号，否则解析会报错。
- 如果XML字符串包含命名空间，解析后的节点操作需要注意命名空间的匹配。
- 跨域请求返回的XML字符串如果存在格式问题，需要先清洗特殊字符再解析。
- 解析后的XML文档操作和普通HTML DOM操作逻辑基本一致，可以复用DOM操作的相关知识。