XML数据岛是IE浏览器曾经支持的一项特性，允许开发者将XML数据直接嵌入到HTML页面中，通过DOM接口对嵌入的XML数据进行操作，实现数据的修改和添加是XML数据岛常见的使用场景。
XML数据岛基础配置
首先需要先在HTML页面中定义XML数据岛，使用<xml>标签嵌入XML结构，示例代码如下：
<xml id="studentDataIsland">
<students>
<student>
<id>1001</id>
<name>张三</name>
<age>20</age>
</student>
<student>
<id>1002</id>
<name>李四</name>
<age>21</age>
</student>
</students>
</xml>
修改XML数据岛中的现有数据
修改数据需要先获取XML数据岛的DOM对象，再定位到目标节点修改其文本内容，具体步骤如下：
- 通过
document.getElementById获取XML数据岛对象 - 调用
XMLDocument的selectSingleNode方法定位目标节点 - 修改目标节点的
text属性完成数据更新
以下是将id为1001的学生年龄修改为22的代码示例：
// 获取XML数据岛对象
var xmlIsland = document.getElementById("studentDataIsland");
// 获取XML文档对象
var xmlDoc = xmlIsland.XMLDocument;
// 定位id为1001的学生的age节点
var targetAgeNode = xmlDoc.selectSingleNode("/students/student[id='1001']/age");
if (targetAgeNode) {
// 修改节点文本内容
targetAgeNode.text = "22";
console.log("数据修改成功，当前年龄：" + targetAgeNode.text);
} else {
console.log("未找到目标节点");
}
向XML数据岛中添加新数据
添加新数据需要创建对应的XML节点，设置节点内容后插入到合适的位置，步骤如下：
- 创建新的元素节点，对应XML的结构层级
- 为新的元素节点设置文本内容
- 将新创建的节点追加到父节点下
以下是添加一个新的学生记录的代码示例：
var xmlIsland = document.getElementById("studentDataIsland");
var xmlDoc = xmlIsland.XMLDocument;
// 获取students根节点
var rootNode = xmlDoc.selectSingleNode("/students");
// 创建student节点
var newStudentNode = xmlDoc.createElement("student");
// 创建id子节点
var idNode = xmlDoc.createElement("id");
idNode.text = "1003";
// 创建name子节点
var nameNode = xmlDoc.createElement("name");
nameNode.text = "王五";
// 创建age子节点
var ageNode = xmlDoc.createElement("age");
ageNode.text = "19";
// 将子节点追加到student节点
newStudentNode.appendChild(idNode);
newStudentNode.appendChild(nameNode);
newStudentNode.appendChild(ageNode);
// 将student节点追加到根节点
rootNode.appendChild(newStudentNode);
console.log("新学生数据添加成功");
操作注意事项
XML数据岛仅在IE浏览器中支持，现代浏览器已经不再兼容该特性，实际开发中如果需要处理XML数据，建议使用标准的XMLHttpRequest或者Fetch API获取XML数据后操作。另外在修改和添加数据时，需要确保节点的路径正确，避免操作到不存在的节点导致报错。
注意：所有的XML标签在操作时都需要按照正确的层级关系处理，节点名称需要和XML数据岛中定义的结构完全一致。
验证操作结果
完成修改和添加操作后，可以通过遍历XML节点验证结果，示例代码如下：
var xmlIsland = document.getElementById("studentDataIsland");
var xmlDoc = xmlIsland.XMLDocument;
// 获取所有student节点
var allStudentNodes = xmlDoc.selectNodes("/students/student");
for (var i = 0; i < allStudentNodes.length; i++) {
var id = allStudentNodes[i].selectSingleNode("id").text;
var name = allStudentNodes[i].selectSingleNode("name").text;
var age = allStudentNodes[i].selectSingleNode("age").text;
console.log("学生ID：" + id + "，姓名：" + name + "，年龄：" + age);
}