使用script标签嵌入XML数据是HTML5中模拟XML data island的推荐方式,通过<script type="application/xml">包裹XML内容,再利用JavaScript读取textContent并用DOMParser解析为XML文档对象,实现数据提取与操作。

在HTML5中直接嵌入XML数据,可以通过“XML data island”技术实现。虽然这个概念最早出现在旧版IE浏览器中,现代HTML5本身并不原生支持XML data island,但仍然可以通过一些兼容方式模拟实现类似效果。
使用 <script> 标签嵌入XML数据
最推荐的方式是利用 <script type="application/xml"> 或自定义MIME类型来嵌入XML数据,使其不被解析为脚本,但可被JavaScript读取。
示例:
<script id="xmlData" type="application/xml">
<users>
<user id="1"><name>张三</name><age>28</age></user>
<user id="2"><name>李四</name><age>32</age></user>
</users>
</script>
通过JavaScript提取该XML内容:
const xmlContent = document.getElementById('xmlData').textContent;
const parser = new DOMParser();
const xmlDoc = parser.parseFromString(xmlContent, 'application/xml');
// 现在可以操作 xmlDoc 对象进行查询
const users = xmlDoc.getElementsByTagName('user');
使用 <div> 隐藏容器存储XML(兼容性方案)
对于不支持 script[type=xml] 的环境,可将XML放入隐藏元素中。
立即学习“前端免费学习笔记(深入)”;
示例:
<div style="display:none" id="xmlIsland">
<data>
<item value="A"/>
<item value="B"/>
</data>
</div>
读取方式与 script 方式类似,只是获取 innerHTML 而非 textContent,并注意XSS风险。
注意事项和限制
现代浏览器对XML data island的支持有限,以下几点需注意:
- 旧式 IE 的 <xml> 标签(如 <xml id="..." src="...">)已废弃,仅在IE5-8中有效,不可用于现代开发
- 使用 DOMParser 解析字符串形式的XML是标准做法
- 确保服务器返回真正的 application/xml 内容类型,若用于外部加载
- 避免在XML中包含 字符串,否则会提前闭合标签











