XML 注意事项
来源:互联网 发布:js面向对象编程例子 编辑:程序博客网 时间:2024/06/04 08:15
本文章部分内容转载自 W3school XML 注意事项 ,部分内容转载自 参考资料 。
目录
1. Internet Explorer - XML 数据岛
2. Internet Explorer - 行为
Internet Explorer - XML 数据岛
它是什么? XML 数据岛(XML Data Islands)是 嵌入 HTML 页面中的 XML 数据 。
为什么避免使用它? XML 数据岛只在 Internet Explorer 浏览器中有效。
用什么代替它?在 HTML 中可以使用 JavaScript 和 XML DOM 来解析并显示 XML。
例 1 使用 XML 文档 “cd_catalog.xml”:
<?xml version="1.0" encoding="utf-8"?><catalog> <cd> <song>牵丝戏</song> <singer>微蓝海</singer> <year>2015</year> </cd> <cd> <song>长恨歌</song> <singer>微蓝海</singer> <year>2014</year> </cd> <cd> <song>昔言</song> <singer>微蓝海</singer> <year>2015</year> </cd> <cd> <song>尘埃落定</song> <singer>张敬轩</singer> <year>2013</year> </cd> <cd> <song>披星戴月</song> <singer>张敬轩</singer> <year>2008</year> </cd> <cd> <song>樱花树下</song> <singer>张敬轩</singer> <year>2008</year> </cd> <cd> <song>富士山下</song> <singer>陈奕迅</singer> <year>2006</year> </cd> <cd> <song>明年今日</song> <singer>陈奕迅</singer> <year>2002</year> </cd> <cd> <song>落花流水</song> <singer>陈奕迅</singer> <year>2006</year> </cd> <cd> <song>一丝不挂</song> <singer>陈奕迅</singer> <year>2010</year> </cd></catalog>
把 XML 文档绑定到 HTML 文档中的一个<xml>
标签 。id 属性 定义数据岛的标识符,而 src 属性 指向 XML 文件。
<table>
标签的 datasrc 属性 表示的是数据源,将 HTML 表格绑定到 XML 数据岛。数据岛的 id 前面要加上 “#” 。
<span>
标签的 datafld 属性 表示的是绑定的字段,引用要显示的 XML 元素。在上例中,引用的是 “song” 和 “singer” 元素。
当读取 XML 时,会为每个<cd>
元素创建相应的表格行。
<html> <head></head> <body> <xml id="cdcat" src="cd_catalog.xml"></xml> <table border="1" datasrc="#cdcat"> <tr> <td><span datafld="song"></span></td> <td><span datafld="singer"></span></td> </tr> </table> </body></html>
注释:
为了提高与 HTML5 的可互操作性和兼容性, Internet Explorer 10 标准模式和 Quirks 模式中删除了对”XML 数据岛”的支持 。
这意味着,与在其他浏览器中相同,XML 数据岛将被分析为 HTML。
使用了 XML 数据岛的页面在 Windows Internet Explorer 9 中可正常工作,但在 Internet Explorer 10 中无法正常工作。
在 HTML 页面添加 meta 标记,以选择采用 Internet Explorer 9 行为:
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9">
例 2 在 HTML 中引入 XML 数据岛的方式是 在 HTML 中直接嵌入 XML 。
可以绑定 XML 的 HTML 元素有:
a、button、div、frame、iframe、img、input(checkbox、hidden、label、password、radio 和 text)、label、span、table 和 textarea 等。
其中<table>
比较特殊,它可以通过 datapagesize属性 指定每页的行数,然后 分页,在<tbody>
中循环显示所有记录。代码如下:
<html> <head> <title> XML 数据岛</title> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9"> </head> <body> <xml id="cd_catalog"> <?xml version="1.0" encoding="utf-8"?> <catalog> <cd> <song>牵丝戏</song> <singer>微蓝海</singer> <year>2015</year> </cd> <cd> <song>长恨歌</song> <singer>微蓝海</singer> <year>2014</year> </cd> <cd> <song>昔言</song> <singer>微蓝海</singer> <year>2015</year> </cd> <cd> <song>尘埃落定</song> <singer>张敬轩</singer> <year>2013</year> </cd> <cd> <song>披星戴月</song> <singer>张敬轩</singer> <year>2008</year> </cd> <cd> <song>樱花树下</song> <singer>张敬轩</singer> <year>2008</year> </cd> <cd> <song>富士山下</song> <singer>陈奕迅</singer> <year>2006</year> </cd> <cd> <song>明年今日</song> <singer>陈奕迅</singer> <year>2002</year> </cd> <cd> <song>落花流水</song> <singer>陈奕迅</singer> <year>2006</year> </cd> <cd> <song>一丝不挂</song> <singer>陈奕迅</singer> <year>2010</year> </cd> </catalog> </xml> <table id="tbl" border="1px" width="300px" height="300px" align="center" datasrc="#cd_catalog" datapagesize="5"> <thead> <tr bgcolor="#DCDCDC"> <th>歌曲名称</th> <th>演唱歌手</th> <th>发布日期</th> </tr> </thead> <tbody> <tr align="center"> <td><span datafld="song"></span></td> <td><span datafld="singer"></span></td> <td><span datafld="year"></span></td> </tr> </tbody> </table> <br> <div align="center"> <input type="button" value="首页" onclick="tbl.firstPage()" /> <input type="button" value="上一页" onclick="tbl.previousPage()" /> <input type="button" value="下一页" onclick="tbl.nextPage()" /> <input type="button" value="尾页" onclick="tbl.lastPage()" /> </div> </body></html>
页面效果展示如下:
Internet Explorer - 行为
它是什么? Internet Explorer 5 引入了行为(behaviors)。Behaviors 是 通过使用 CSS 样式向 XML (或 HTML )元素添加行为 的一种方法。
为什么避免使用它?只有 Internet Explorer 支持 behavior 属性。
用什么代替它?使用 JavaScript 和 XML DOM (或 HTML DOM)来代替它。
在微软 IE 5.0 版本的浏览器发布以前,网页编程中面临的最大挑战就是不能简单地创建组件,以达到 多页面之间代码重用 的目的。
这个问题一直困扰着 DHTML(Dynamic HTML)的网页编程者。他们只能不断地重复书写 HTML、CSS 和 Javascript 的代码,以满足多个页面上的重复或相似的功能。
自 IE 5.0 浏览器发布后,这种情况得到了改善,它可以将实现特定功能的代码封装在一个组件内,从而实现多页面的代码重用,这种新的技术就是 DHTML 中的”行为”(Behaviors)。
“行为”作为一个简单易用的组件,封装了页面上特定的功能或动作。当把一个”行为”附到 WEB 页面中的一个元件上时,这个元件的原有行为就会有所改变。网页编程者可以用”行为”来增强一个对象的功能,同时也简化了页面的 HTML 代码。
例1 的 HTML 文件中的<style>
元素为<span>
元素定义了一个行为:
<html> <head> <title>Internet Explorer Behavior</title> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9"> <style type="text/css"> span { behavior: url(behave.htc); position:relative; } button { margin=10px 10px 0px 0px; } </style> </head> <body> <span id="myspan">Mouse over me!!!</span> <br> <button onclick="myspan.move_up()">向上移动</button> <br> <button onclick="myspan.move_down()">向下移动</button> <br> <button onclick="myspan.move_left()">向左移动</button> <br> <button onclick="myspan.move_right()">向右移动</button> </body></html>
下面的 behave.htc 文件包含了一段 JavaScript,以及针对元素的事件句柄:
<PUBLIC:COMPONENT>//"行为"添加4个事件//"EVENT" 对应事件名称,"ONEVENT" 对应事件的事件句柄(Event Handlers),即事件触发时所调用的函数名称//当浏览器检测到某事件发生时,便查找该事件对应的事件句柄有没有被赋值,如果有,则执行该事件句柄<PUBLIC:ATTACH EVENT="onmouseover" ONEVENT="font2blue()" /><PUBLIC:ATTACH EVENT="onmouseout" ONEVENT="font2green()" /><PUBLIC:ATTACH EVENT="onmousedown" ONEVENT="font2red()" /><PUBLIC:ATTACH EVENT="onmouseup" ONEVENT="font2yellow()" /><PUBLIC:METHOD NAME="move_up"><PUBLIC:METHOD NAME="move_down"><PUBLIC:METHOD NAME="move_left"><PUBLIC:METHOD NAME="move_right"><script type="text/javascript"> function font2red() { element.style.color="red"; } function font2green() { element.style.color="green"; } function font2yellow() { element.style.color="yellow"; } function font2blue() { element.style.color="blue"; } //定义向上移动文字的方法 function move_up() { element.style.posTop -= 100; } //定义向下移动文字的方法 function move_down() { element.style.posTop += 100; } //定义向左移动文字的方法 function move_left() { element.style.posLeft -= 100; } //定义向右移动文字的方法 function move_right() { element.style.posLeft += 100; }</script></PUBLIC:COMPONENT>
例2 的 HTML 文件中的<style>
元素为<h1>
元素定义了一个行为:
<html> <head> <title>Internet Explorer Behavior</title> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9"> <style type="text/css"> h1 { behavior: url(behave.htc) } </style> </head> <body> <h1>Mouse over me!!!</h1> </body></html>
下面的 behave.htc 文件包含了一段 JavaScript,以及针对元素的事件句柄:
<attach for="element" event="onmouseover" handler="hig_lite" /><attach for="element" event="onmouseout" handler="low_lite" /><script type="text/javascript"> function hig_lite() { element.style.color='red'; } function low_lite() { element.style.color='blue'; }</script>
参考资料:
XML 数据岛
HTC(HTML Component)开发简介
- xml 注意事项
- xml注意事项
- xml注意事项
- XML注意事项
- XML 注意事项
- XML 注意事项
- PHP输出XML注意事项
- Qt+xml+xsl注意事项
- XML 注释 注意事项
- xml文件的注意事项
- AndroidManifest.xml注意事项
- AndroidManifest.xml注意事项
- web.xml配置注意事项
- AndroidManifest.xml注意事项
- AndroidManifest.xml注意事项
- AndroidManifest.xml注意事项
- Xml序列化的注意事项
- ironpython2.6解析xml注意事项
- Windows路径含有带空格的目录/文件名的处理
- 【分布式】Zookeeper使用--开源客户端
- zookeeper windows x64 环境搭建
- linux查找文件夹命令
- 使用Redis实现分布式锁的原理
- XML 注意事项
- 数据结构课程设计
- 排序概念与插入类排序
- 日本主要二手车集团及其经销商接受比特币支付
- SEC暂停一加密货币公司证券交易
- 研究发现2018年三分之一的千禧世代将购买加密货币
- 记录一些自己常用的linux上的命令
- HashMap的工作原理
- 爱沙尼亚推动发行“国家数字货币”进程