网站地图 RSS订阅 联系我们

网页设计精选XML教程

来源:会龙宏网 发表于2010-7-22 11:11:57 阅读(0) 评论(0)

网页设计精选:XML教程

严格的语法

网络在中国发展到今天,一定有很多人或多或少的接触过HTML语言,这是一种不甚严格的语言(也可以讲是浏览器大战的恶果),很多时候我们直接看到的效果并非是我们的代码表现出来的效果,而是浏览器很善意的向你们屈服,将一些不完全的代码也正常显示......然而,XML显然不吃这一套,由于她主要用来存储和发送数据信息,所以她的语法规则必然要求的非常严格,不过严格归严格,学习起来到是非常的容易---而且使用也同样的简单.基于这个原因,我们可以轻易的建立可以读取和维护XML的应用软件.网页设计

让我们来看一段简单的XML代码:

<?xml version="1.0" encoding="GB2312"?>
<我的故事>
<作者>Jsper</作者>
<出版社>unkown</出版社>
<体裁>个人传记</体裁>
</我的故事>

代码的第一行是XML声明,并且定义XML的版本,目前发布的是1.0版本
代码的第二行是这端代码内容的根元素.是XML所必须声明的元素.
代码的3-5行是根元素的子元素,在这里有三个子元素(作者,出版社,体裁)
最后一行的代码则定义了根元素的结束,到这里,一段完全的XML代码就算完成

细心的人从上面的例子看出,所有的元素都要有闭合标记,这并非是一个巧合我们开始就讲到XML语法规则非常严格,这就是她的具体表现---所有的元素必须有闭合标记---

e.g: 在HTML语法中,这样的代码是允许存在的...

<p>我的故事是什么呢?
<p>我忘记了

然而在XML语法中,则需要闭合所有元素,于是代码如下
<p>我的故事是什么呢?</p>
<p>我忘记了</p>

一旦没有闭合元素代码,比如在这段代码中如果我们漏掉</p>,那么这段代码将是一段错误代码,不起任何作用.

XML语法规则要求严格的第二表现---大小写敏感---这也是在语法规则上与html不同的地方.元素名称必须区分大小写(元素闭合代码要与元素本身大小写一致).

e.g: 下面两行代码,第一行是错误的,第二行是正确的
<p>我的故事是什么呢?</P>
~~~~
<p>我的故事是什么呢?</p>
XML语法规则要求严格的第三表现---嵌套对应

---我们在html代码中经常见到这样的例子
html: <b><i>呵呵,真的管理不严哟</b></i>
然而在XML代码中,则拒绝上述代码书写规格,所有的元素必须一一对应
XML: <b><i>哇赛,真的好严格哟</i></b>

当我们声明一个XML文件的同时,我们必须建立一个根元素标记,就如同一篇文章的标题一样.所有的XML代码都要有根元素
e.g:

<?xml version="1.0" encoding="GB2312"?>
<我的故事> ----根元素,任何完整的XML代码必须包含此元素
............. ----子元素内容,以"<xxx>",</xxx>形式描述
</我的故事>

XML语法规则严格的表现第五:"懒惰等于慢性自杀"

还记得'"'双引号么?在我们编写html的时候,往往会忽略掉引号,有时候即使知道.但懒惰的天性总是让我们不愿正确的去输入...因果相报,以前的坏习惯到了编写XML的时候变成了最可怕的噩梦....一旦忽略了引号..我们会陷入烦恼的境界,尤其是在用于描述庞大复杂的数据的时候...引号的修改会累垮你的(这里有自动整理数据为XML的软件,但我不打算现在推荐,怕好心办坏事呀,养成好习惯很重要--别恨我)....而且当我们xml元素含有属性值得时候,这个属性值也必须被引号包含

e.g:
<?xml version="1.0" encoding="GB2312"?>----这行引号要是少了就不是XML文件了^^
<我的故事 价值="无价之宝"> ---如果属性值失去双引号,则出现错误
.................
</我的故事>

XML语法规则严格的表现第六:"空白真的是虚无么?"

记不得谁说的了"空既是无",我甚至一度为此痴迷,差点出家...可是当我遇到了XML....我的思想不得不改变了(空并非无),我的每一个空格都会单独的蹦出来就好像隐形人一样,看不见,却占着空间.也不知道这是不是严格的规则^_^


今天的课程到此结束,请期待后续课程,希望各位网友安排好学习时间^_^


XML元素与XML属性值

XML元素是可扩展的.也就意味着XML文档内容可以随时通过扩展来储存更多的数据信息.

 

e.g:

<?xml version="1.0"encoding="GB2312"?>
<龙虾大餐>
<价格>枪毙你的工资</价格>
<口感>一斑斑</口感>
<副作用>闹肚子</副作用>
</龙虾大餐>

  这时,如果我们要通过我们的应用程序或其他的东西来输出这段数据的部分内容,如<价格>,<口感>,<副作用>.将会现实如下结果(输出结果因你的输出形式确定,xml数据内容本身不做改变)

e.g:

关于龙虾大餐
价格:枪毙你的工资
口感:一斑斑
副作用:闹肚子
欢迎您品尝 (此例子为假想例子,除数据内容为实外其他皆为假想,请不要搞乱你的头绪)

  当输出后我们忽然发现,还需要向数据中添加新的数据,该怎么办呢?

  很简单,直接夹在XML数据中即可.
e.g:

<?xml version="1.0"encoding="GB2312"?>
<龙虾大餐>
<价格>枪毙你的工资</价格>
<口感>一斑斑</口感>
<副作用>闹肚子</副作用>
<意见>可以用活的龙虾代替么?</意见>
<感想>还是有钱好,起码饭后还有钱付治疗肠胃的医药费
</感想>
</龙虾大餐>

  一定有人会问"这样添加数据会影响到前面的假想例子么?".呵呵,不会!

  在我们添加数据后,上面的假想例子依然输出同样的结果.而且也可以通过改变应用程序来显示我们新加入的数据.
XML元素间关系,由于XML元素必须规定根元素,所以根元素以下的元素都为子元素,相互为兄弟元素关系,为了数据存储方便,请确保子元素内容与根元素相关,并且各个兄弟元素间也最好有逻辑上的关联.

  XML元素内容,一个完整的XML文件由于它的用于储存数据的特性决定它一定要有内容,而它的内容则是被声明在各个元素之中的,在这里,这个内容可以是空白内容,也可以是简单的文本或单一数据,也可以复杂的多个数据列,甚至还可以是其他的分类子元素.

  XML元素命名规则,同java,c等命名规则类似,可以是英文字母或中文作为元素名(也可以是其他语言,但要首先确保你的数据读取软件可以支持),可以用数字和字母作为名字开头,名称中不能出现空格!!!可以用下划线"_"取代空格的功能来进行详细命名,而且在名称中严禁出现":"号

XML系列教程第三讲-XML属性值


  前面的讲座中曾经出现过元素的属性值.

e.g:

<我的故事 价值="无价之宝">
.........
</我的故事>

  其中价值="无价之宝"这段代码就是根元素"我的故事"的属性值

  那么,属性值可以做什么呢?xml中的属性值可以被用来为元素添加额外的说明信息.其实我们很早以前就已经接触过属性值,而且频率非常的高,那就是出现在html中的属性值.

e.g:
<font size="7" color="red">属性值在html中的运用</font>
~~~~~~~~ ~~~~~~~~~~~
<a href="http://go.go.go">到处都是属性值的运用</a>

在xml中,我们也可以应用属性值到元素,但不要太频繁,毕竟XML是用来储存和发送数据信息的,因此它的可扩展性就显得非常重要,我们可能随时需要向xml文件中添加数据,虽然使用属性值可以方便的为元素添加额外信息说明,但是这样做非常不利于日后的维护和更新...更何况,这些事情使用元素来做才是正确真正的选择(因此,本人不推荐频繁使用属性值).

e.g:

属性值运用

<?xml version="1.0" encoding="GB2312"?>
<我的介绍 姓名="jsper" 性别="unknow" 职业="无"联系方式="jsper@371.net">
</我的介绍>

不使用属性值

<?xml version="1.0" encoding="GB2312"?>
<我的介绍>
<姓名>jsper</姓名>
<性别>unknow</性别>
<职业>无</职业>
<联系方式>jsper@371.net</联系方式>
</我的介绍>

  显而易见,频繁的使用属性值很难与维护和更新,而且,使用属性值还有一系列的弱点---
1,属性值不可以包含多重数值(元素可以);
2,属性值难于扩展(考虑到长远打算);
3,属性值不能够用于描述结构内容(子元素则可以);
4,属性值很难通过DTD来进行一个测试(关于DTD的介绍,请期待后续教程)

  也许你们的语法老师都告诉过你们这样一句话"是规则就有例外",在这里也同样应验...毕竟属性值也不是一无是处^_^.我们可以用数值来表示同一元素的不同内容.如下

e.g:
<?xml version="1.0"encoding="GB2312"?>
<通讯薄>
<我的网友 编号="008">
<姓名>飞鸟</姓名>
<性别>未知</性别>
<联系方式>不详</联系方式>
</我的网友>

<我的网友 编号="009">
<姓名>飞鱼</姓名>
<性别>中性</性别>
<联系方式>未知</联系方式>
</我的网友>
</通讯薄>

  在这里,我们用的是数字来区分元素"我的网友",当然你也可以用其他的方式来区分.例如"编号="一号"


CSS在xml中的应用  网页设计

已经进行了2讲了...想必一定有很多人等着看我的好戏,呵呵,关于XML的基础知识,我们已经大致了解了,在进行更高级的课程之前,请允许我稍微改变一下课程安排,以便能够让你们"看"下去(国内太多枯燥的课程了,很多次我看的头昏眼花想呕吐,不过,他们的语言很精练,很学究^_^,不像我,罗里罗唆)...所以我临时决定插一道菜进来,那就是---魔法的揭示---CSS在XML中的应用...不是盖的哟,你的XML数据内容可以直接看了(不是目录树,是真的显示出来哟).

 

  事先声明,正规的用来显示XML数据的方法是使用XSL等技术(下一讲---皇家的术士--XSL在XML中的应用),这里介绍只是一种通过现有的技术显示XML数据的方法(你不得不承认CSS是广泛存在于国内的^^).

下面是一段常见的XML代码:
e.g:

<?xml version="1.0" encoding="GB2312"?>
<mywrong>
<reason>有人说我的文章废话连篇</reason>
<question>我真的是废话连篇,罗里罗唆么?</question>
<think>我是不是应该考虑以严谨的,充满学究味道的写作风格继续进行创作? </think>
<request>如果你对我的教程有意见,请一定写信给我Jsper@371.net</request>
</mywrong>

  接下来是一段常见的CSS代码(进行html网页制作的怎么可能不知道?我在此不再阐述)
e.g:

mywrong
{
background-color: #ffffff;
width: 100%;
}

reason
{
font-family : "宋体";
font-size : 22pt;
display: block;
margin-bottom: 10pt;
margin-left: 20;
}

question
{
font-family : "宋体";
font-size : 9pt;
color: red;
}
think
{
font-family : "宋体";
font-size : 9pt;
Display: block;
margin-bottom: 10pt;
color: green;
}

request
{
font-family : "宋体";
font-size :9pt;
Display: block;
color: yellow;
margin-left: 20pt;
}

  在接下来是混合CSS到XML中的代码,仅仅添加一行用以引用CSS文件的代码
e.g:
<?xml version="1.0" encoding="GB2312"?>
★★★ <?xml-stylesheet type="text/css" href="mywrong.txt"?>
<mywrong>
<reason>有人说我的文章废话连篇</reason>
<question>我真的是废话连篇,罗里罗唆么?</question>
<think>我是不是应该考虑以严谨的,充满学究味道的写作风格继续进行创作?</think>
<request>如果你对我的教程有意见,请一定写信给我Jsper@371.net</request>
</mywrong>

  然后请分别将三段代码存为mybackup.xml,mywrong.txt,mywrong.xml之后在浏览器输入mywrong.xml地址,呵呵,效果出来了吧!


皇家的术士(初涉XSL)

激动人心的时刻到了,听,皇家的号角已经响起,皇家的术士--XSL--出场了!!

 

  讲起xsl(eXtensible StylesheetLanguage),我忍不住又要把html拉出来了(反正它也习惯了^^),在html中,有许多简单易懂的标记用来显示数据内容,比如我们可以通过<h1>,<fontcolor>等来设置数据内容的显示格式,而且这些标记通过名称就可以很容易的判断出用途,但是.谁叫它天生就是用来显示数据信息的呢?不过我们的XML就不能这样了,天生就是用来储存和发送数据信息的(劳累命呀),所以,不得已只能求助其他的方式来显示数据内容,于是,我们的术士就出现了.

  作为术士,XSL会的东西远比我们前面介绍的CSS强大的多.它由两种方式构成,一种方式用来转换XML文本内容,另一种则是格式化XML文本内容.我们可以通过XSL首先转换(过滤和整理)XML数据内容,并通过XSL的格式化显示方法定义数据内容显示方式(比如字体大小,颜色等).

  我们的术士也可以定义一个可以被浏览器支持的用来显示转换后的XML数据的方式,目前来讲,这种方式往往是转换XML元素为HTML元素.

  同时,XSL也可以加入或者移除一些元素到输出文件(可以理解为魔法的力量^^),也可以重新整理排列这些元素,并且决定哪些元素将要被显示和如何被显示.

  接下来,是我们的魔法展示,请留心观看:

e.g:

第一部分,一个简单的XML文件:

<?xml version="1.0" encoding="GB2312"?>
<国王的心腹>
<皇家术士>
<姓名>jsper</姓名>
<代号>008</代号>
<性别>unknow</性别>
<地位>术士(不是骗人的巫婆和半仙)</地位>
<爱好>施展internet魔法</爱好>
<附注>
哪位好心人可以提供我一个工作?术士快交不起电话费了
我的信箱是ihong@achoc.com 我的qq是:327013113
</附注>
<谢谢>真的很感谢你们对我的支持,我会继续努力的
</谢谢>
</皇家术士>
<皇家术士>
<姓名>XSL</姓名>
<代号>001</代号>
<地位>
the eXtensible Stylesheet Language
</地位>
</皇家术士>
</国王的心腹>

请将此代码内容保存为mybackup.xml

第二部分,首次出现的XSL文件:

<?xml version="1.0" encoding="GB2312"?>
<html xmlns:xsl="http://www.w3.org/TR/WD-xsl">
<body style="font-size:12pt;background-color:blue">
<xsl:for-each select="国王的心腹/皇家术士">
<div style="background-color:green;color:white;padding:4px">
<span syle="font-weight:bold;color:white">
姓名:<xsl:value-of select="姓名"/>
</span>
<p>代号:<xsl:value-of select="代号"/></p>
<p>性别:<xsl:value-of select="性别"/></p>
<p>地位:<xsl:value-of select="地位"/></p>
<p>爱好:<xsl:value-of select="爱好"/></p>
</div>
<div style="background-color:yellow;color:red;
font-size:9pt;margin-bottom:10pt;">
<p><center><xsl:value-of select="附注"/></center></p>
</div>
<div style="background-color:orange;color:green;
font-size:9pt;">
<center><xsl:value-of select="谢谢"/></center>
</div>
</xsl:for-each>
</body>
</html>

请将此段代码内容保存为aboutme.xsl
第三部分.混合显示魔法

<?xml version="1.0" encoding="GB2312"?>
<?xml:stylesheet type="text/xsl" href="aboutme.xsl"?>
<国王的心腹>
<皇家术士>
<姓名>jsper</姓名>
<代号>008</代号>
<性别>unknow</性别>
<地位>术士(不是骗人的巫婆和半仙)</地位>
<爱好>施展internet魔法</爱好>
<附注>
哪位好心人可以提供我一个工作?术士快交不起电话费了
我的信箱是ihong@achoc.com 我的qq是:327013113
</附注>
<谢谢>真的很感谢你们对我的支持,我会继续努力的</谢谢>
</皇家术士>
<皇家术士>
<姓名>XSL</姓名>
<代号>001</代号>
<地位>the eXtensible Stylesheet Language</地位>
</皇家术士>
</国王的心腹>

请将此段代码内容保存为aboutme.xml

  当我们在浏览器中打开aboutme.xml的时候...我们就可以看到神奇的魔法效果了^^

  至此,我们对xsl已经有了初步了解,关于它的深度讲解请期待后续教程,谢谢.


xml中的数据岛

暂时忘记前面的术士,让我们再一次回到xml构造的数据世界,以前我总是爱讲"详细内容请看后面章节",这次没办法拖了,只好开始讲述"后面章节"的内容,今天所要讲述的是DataIslands(直译就行了,数据岛).

  我们用数据岛可以做什么呢?,我们可以利用数据岛将我们的XML嵌入到html叶面中,至于怎么做,就看我接下来的演示好了.

  我们可以通过<xml>(请把这里的<XML>标记看作为html元素)标记来嵌入我们的XML数据.也可以通过引用来导入一个外部的独立的XML文件.

e.g:

1,内嵌XML数据

<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=gb2312">
<title>第一次亲密接触(非痞子蔡版,请不要理解为侵权)</title>
</head>
<body>
<xml id="第一次亲密接触">
<第一次亲密接触>
<对象>xml</对象>
<亲密程度>接触到XML稍微宝贵的地方---数据岛</亲密程度>
<结论>感觉不错,是个好东东</结论>
</第一次亲密接触>
</xml>
<center><h1>第一次亲密接触</h1></center>
<table border="0" datasrc="#第一次亲密接触" align="center" width="443">
<tr>
<td bgcolor="#99FF99">对象: <span datafld="对象"></span></td>
<td bgcolor="#3399CC">亲密程度:<span datafld="亲密程度"></span></td>
<td bgcolor="#CC99CC">结论: <span datafld="结论"></span></td>
</tr>
</table>
</body>
</html>
e.g:

2.外部xml文件的引用

  首先利用以前的知识建立一个XML文件(不是我懒,给你们一个机会锻炼^^)

  涉及到以下<xml></xml>中的数据内容
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=gb2312">
<title>第一次亲密接触(非痞子蔡版,请不要理解为侵权)</title>
</head>
<body>
<xml id="第一次亲密接触" src="firstlove.xml">
<第一次亲密接触>
<对象>xml</对象>
<亲密程度>接触到XML稍微宝贵的地方数据岛</亲密程度>
<结论>感觉不错,是个好东东</结论>
</第一次亲密接触>
</xml>
<center><h1>第一次亲密接触</h1></center>
<table border="0" datasrc="#第一次亲密接触" align="center">
<tr>
<td bgcolor="#99FF99">对象: <span datafld="对象"></span></td>
<td bgcolor="#3399CC">亲密程度:<span datafld="亲密程度"></span></td>
<td bgcolor="#CC99CC">结论: <span datafld="结论"></span></td>
</tr>
</table>
</body>
</html>

  我们可以通过指定XML文件位置来引用她,一般通过src="XXX.xml"引用.

 

0
顶一下
0
踩一下
评论列表
温馨提示:网友评论仅供其表达个人看法,并不表明本站同意其观点或证实其描述。
评论加载中...
发表评论
昵称:验证码:看不清楚,换张图片!
附加功能
回顶部