XML数据岛技术

最新推荐文章于 2020-04-14 18:08:30 发布

最新推荐文章于 2020-04-14 18:08:30 发布 · 197 阅读

文章标签：

#XML #Gmail #HTML

J2EE技术专栏收录该内容

20 篇文章

订阅专栏

XML 数据岛（ data islands ）就是被 html 页面引用或者包含的 xml 数据，优点是将 xml 中的数据和 html 元素进行绑定。
注意：应用id，datasrc ,datafld 属性，在页面中的数据岛和其他的 xml 数据一样，可以通过标准的dom 方法来进行访问。

数据岛有两种定义方式:
一种是直接将上述 xml 嵌入到 html 页面中.
一种是xml 数据保存在单独的 xml 文件中，在页面只需嵌入如下：
<xml id= "island" src= "xxx.xml" ></xml>

xxx.xml如：
<xml id= "island" >

<root>

<p1>
<name> magicdoom </name>

<age> 24 </age>

<email> magicdoom@gmail.com </email>

</p1>
</root>

</xml>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
//<xml id= "island" src= "xxx.xml" ></xml> 这是第二种方法

<HTML>
<HEAD>
<TITLE> New Document </TITLE>
</HEAD>
<BODY>

//第一种方法
<xml id= "island" >

<root>

<p1>
<name> hello </name>

<age> 24 </age>

<email> hellodom@126.com </email>

</p1>

<p1>
<name>test</name>

<age> 24 </age>

<email> test@126.com </email>

</p1>

</root>

</xml>

<table width="100%" datasrc="#island">

<thead>

<tr>

<th>Name</th>

<th>Age</th>

<th>Email</th>

</tr>

</thead>

<tbody>

<tr>
<td align="center" ><span datafld="name"></span></td>

<td align="center"><span datafld="age"></span></td>

<td align="center"><span datafld="email"></span></td>

</tr>

</tbody>

</table>

<script>
xmldoc = island; //取数据岛

var rootElement = xmldoc.documentElement.firstChild; //取根元素root

//实现打印出数据岛中第一个元素的值

if (rootElement.hasChildNodes())

alert(rootElement.firstChild.text);//hello

//创建一个新的元素，添加到数据岛中

var test = xmldoc.createElement('test');//<test>

var testTxt = xmldoc.createTextNode("This is a test!");

test.appendChild(testTxt);//<test>This is a test</test>

rootElement.appendChild(test);

alert(rootElement.lastChild.text);

//删除数据岛中的一个元素

rootElement.removeChild(rootElement.lastChild);

//修改数据岛中的一个元素的值

rootElement.firstChild.text="new value";

//查找xml元素使用getElementsByTagName返回一个element的数组
alert(rootElement.getElementsByTagName("name")(0).text);

</script>

</BODY>
</HTML>