自 Microsoft Internet Explorer 5.0 起,Internet Explorer 有一个非标准特性称为 XML 数据岛,它允许使用非标准 HTML 标签 <xml>
在 HTML 文档中嵌入 XML。Mozilla 不支持 XML 数据岛,将其作为未知的 HTML 标签处理。所以,XML 数据岛只在 IE 浏览器中有效。现在的 web 应用客户端浏览器都要求支持多浏览器,这岂不是给我们出难题吗? 幸好 IE 和 Mozilla 都支持 XML DOM,我们可以使用 JavaScript 结合 XML DOM 来解析并显示 XML。
什么是 XML 数据岛? 数据岛就是被HTML页面引用或包含的XML数据,XML数据可以包含在HTML文件内,也可以包含在某外部文件内。就像 JavaScript 和 CSS 一样,你可以在 HTML 文挡中直接嵌入 XML 数据,也可以引用外部的 XML 数据。在把 XML 文档绑定到 HTML 文档中的一个 <xml> 标签。其id 属性为数据岛定义标识符,而其 src 属性指向 XML 文件。示例代码如下:
xmldataisland.hmtl 文件
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>xml data island</title>
</head>
<body>
<xml id="employees"> <!-- 唯一 id -->
<?xml version="1.0" encoding="utf-8" ?>
<employees>
<employee>
<id>1</id>
<name>zhaipuhong</name>
<gender>male</gender>
<age>28</age>
</employee>
<employee>
<id>2</id>
<name>dingxia</name>
<gender>female</gender>
<age>25</age>
</employee>
</employees>
</xml>
<xml id="majors" src="major.xml"></xml> <!-- 唯一 id -->
<table datasrc="#employees"> <!-- 请不要忘了符号 '#' -->
<tr><!--<div> 标签允许 datafld 属性引用要显示的 XML 元素-->
<td><div datafld="id"></div></td>
<td><div datafld="name"></div></td>
<td><div datafld="gender"></div></td>
<td><div datafld="age"></div></td>
</tr>
</table>
<table datasrc="#majors"> <!-- 请不要忘了符号 '#' -->
<tr><!--<span> 标签允许 datafld 属性引用要显示的 XML 元素-->
<td><span datafld="name"></span></td>
<td><span datafld="term"></span></td>
</tr>
</table>
</body>
</html>
major.xml 文件
<?xml version="1.0" encoding="utf-8"?>
<majors>
<major>
<name>Information Technology</name>
<term>4 year</term>
</major>
<major>
<name>mathimatics</name>
<term>4 year</term>
</major>
</majors>
<table> 标签的 datasrc 属性把 HTML 表格绑定到 XML 数据岛。
运行结果如下:
1 zhaipuhong male 28
2 dingxia female 25
Information Technology 4 year
mathimatics 4 year
以上简单介绍了 IE 浏览器中使用 XML 数据岛 ,那么要跨浏览器使用 XML 数据岛 则应该使用 XML DOM 解析器。它解析包含序列化 XML 文档的字符串并为解析后的 XML 生成文档。Mozilla 使用 DOMParser
类,它接受序列化字符串并用它创建 XML 文档。在 Internet Explorer 可用 ActiveX 实现同样的功能。下面简要学习一下。
微软的 XML 解析器内建于 Internet Explorer 5 以及更高的版本中,在 JavaScript 中创建并载入 xml 文件:
//创建一个空的微软 XML 文档对象
var xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async="false"; //关闭异步加载
//解析器加载 XML 文档
xmlDoc.load("major.xml");
//若加载xml字符串而非XML文件,使用下面的语句
//xmlDoc.loadXML(xmlString); //加载 xml 字符串(文本),根据需要选用
//注意:loadXML() 方法用于加载字符串(文本),load() 用于加载文件
在 Mozilla 的 Firefox 及其他浏览器中的 XML 解析器 ,示例如下:
//创建一个空的微软 XML 文档对象
var xmlDoc=document.implementation.createDocument("","",null);
xmlDoc.async="false"; //关闭异步加载
//加载 XML 文档
xmlDoc.load("major.xml");
//若加载xml字符串而非XML文件,使用下面的语句
var parser=new DOMParser();
var doc=parser.parseFromString(xmlString,"text/xml");
下面给一个完整是浏览器兼容的示例:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>浏览器兼容的 XML DOM 实例</title>
</head>
<body>
<script>
//一个浏览器兼容的实例
var xmlDoc = null;
if(window.ActiveXObject){
xmlDoc = new ActiveXObject("Microsoft.XMLDOM"); //Internet Explorer
}else if(document.implementation.createDocument){
xmlDoc = document.implementation.createDocument("","",null); //Mozilla
}
xmlDoc.async=false;
xmlDoc.load("major.xml");
document.write(xmlDoc.getElementsByTagName("name")[0].childNodes[0].nodeValue);
</script>
</body>
</html>
分享到:
- 2008-07-20 17:59
- 浏览 1732
- 评论(0)
- 论坛回复 / 浏览 (0 / 3572)
- 查看更多
相关推荐
XML基础实例 数据岛XML基础实例 数据岛
XML之数据岛 XML之数据岛
数据岛是指存在于HTML页面中的XML代码。数据岛允许你在HTML页面中集成XML,对XML编 写脚本,而不需要通过脚本或<OBJECT>标签读取XML。
XML 之 DSO模型与数据岛
XML分页排序数据岛 将后台绑定的数据源,绑定到属性,再通过xml绑定到前台
XML数据岛综合了使用XML文档和HTML文档的优点 结构化XML数据可以与一张表格对应,每一列式一个元素,每一行是一条记录包含若干元素
包括XML语法和概述、数据岛、xpath查询等
Web服务器与客户机之间的数据传递方式有三种:HTML页面,XML文档以及XML数据岛。采用数据岛作为交互手段,不仅可以使数据具备一定的语义信息,还能保持HTML的原有特色
NULL 博文链接:https://back-888888.iteye.com/blog/1026892
上下文菜单 就是用户在页面上单击右键时所显示的一组命令。微软的MSDN有一个简单的例子说明了怎样建立自定义...我们这里利用XML数据岛来存储上下文菜单的多个定义,其中的每一个定义都可以和文档中的任一元素相联系。
js操作xml的数据岛技术,js操作xml的数据岛技术
最近做一个有关数据岛的项目,搜集了一些有关数据岛的资料,整理了一下,希望对有些人有用。
xml基础,xml语言的定义,xml的数据岛,xml结点的设置、获取。
关于XML的课件文档,主要是基础,包括XML基础、XSL、SAX、数据岛、XPath、CSS修饰XML文档等等。
非常好的xml示例,简单易学! 第一章 XML基础 第二章 Schema 第三章 文档对象模型 第四章 使用XSLT 第五章 数据岛
xml 老师的ppt xmlxml编程ppt数据岛ddt xsl dom jax xml编程 编程编程编程编程编程
xml 数据岛 部分示例 经典,包括数据、图片、表格、样式
静态页面(html)结合xml数据岛实现的无刷新幻灯片切换效果 html结合xml数据岛实现的无刷新幻灯片切换效果源码,有暂停、运行、翻页等按钮。无需连接数据库,无需IIS等服务器。下载了本地打开就能用。。。。。。
html+xml数据岛实现无刷新首页幻灯片
XML数据岛技术及应用.pdf