DOM文档对象模型

上传人：2*** IP属地：湖北上传时间：2023-02-01 格式：PPT 页数：80 大小：371.50KB 积分：28 举报 版权申诉

已阅读5页，还剩75页未读，继续免费阅读

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

DHTML及客户端脚本

教师：黄强E_mail：hqgz@Tel述开发网站不是仅仅去设计、制作网页，如果只是制作网页的话，我们完全可以使用所见即所得的网页制作软件，如：FrontPage、Dreamweaver等，而不用掌握超文本标识语言、脚本语言之类的编程工具。虽说FrontPage、Dreamweaver等均有网站开发功能，但与语言相比其灵活性就差多了，另外它们生成的程序源代码要复杂、冗长的多。超文本标识语言、脚本语言是网页的基础，是网站生长的“土壤”，加上层叠样式表以及可扩展标识语言等，可以使我们开发出的网站形式更丰富、内容更精彩。初识超文本标识HTML超文本标识语言(HyperTextMarkupLanguage，HTML)结构简单，语法较松散，易学易用。它是一种文字处理语言，而不是“程序”语言。HTML的标识嵌于文本格式的文档中，用来控制文字、图片等在浏览器中的表现，以及如何建立文件之间的链接。程序与之最大的不同，就是可用来控制操作系统或应用程序执行、并完成某项作业。使用超文本标识语言“处理”过的文档应该满足，不管在任何操作系统，任何浏览器上读起来或看上去都是一样的。超文本标识语言最初用于发布信息，并没有在网络上使用。但它那极容易使用的显著特点和随着网络带宽的逐渐增加，人们便将其作为网络上发布信息的首选语言。

例用超文本标识语言书写一段实用程序(L4-1.htm)。<HTML><HEAD><TITLE>超文本标识语言源程序</TITLE></HEAD><BODY>

<H2>物理学家霍金名言</H2><OL><LI>我的手指还能活动，我的大脑还能思维；

<LI>我有终生追求的理想，有我爱和爱我的亲人和朋友；

<LI>对了，我还有一颗感恩的心……

</OL>

<MARQUEEbgcolor="#87CEFA"width="80%">⒈我的手指还能活动，我的大脑还能思维；</MARQUEE><MARQUEEbgcolor="#ADFF2F"behavior="alternate">⒉我有终生追求的理想，有我爱和爱我的亲人和朋友；</MARQUEE><MARQUEEbgcolor="#FFB6C1"scrollamount="1">⒊对了，我还有一颗感恩的心……</MARQUEE></BODY></HTML>运行结果：一般将HTML语言的文件分为三个部分，它们是：l

序(Prologue)l头部(Head)l文件主体(Body)HTML语言文件的主要部分是头部和文件主体。除了头标识和主体标识外，就是附加标识——序(HTML的版本声明)，这种标识放在HTML文档的第一行，而一般的文档中也许没有。序是用来告知浏览器所遵循的HTML版本。HTML语言的基本结构如下：<!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01//EN"><!序><HTML><!HTML文档起始标识><HEAD><!HTML的头信息部分><TITLE><!HTML的标题部分>HTML的基本结构样板</TITLE><!标题结束标识></HEAD><!头信息结束标识><BODY><!这里是HTML的正文部分>HTML文档的基本结构样板，HTML的正文应从这里开始。</BODY><!正文部分结束标识></HTML><!HTML文档结束标识>说明：⑴HEAD标识内的信息一般不在浏览器的主窗口中显示。⑵需要表示的内容和描述内容的标识格式等，一般放在BODY标识内。⑶注释有两种方法：①<!注释内容>，“注释内容”中不可出现右尖括号，一般用于标识里的内容②，“注释内容”中可以出现包括尖括号在内的任何括号，一般用于注释大段的内容。注意，本注释仅用于注释超文本标识语言。⑷可以使用所有编辑纯文本文件的软件，或带有HTML编辑器的软件来编辑HTML，扩展名必须写为.html或.htm。如：记事本、写字板、Word、FrontPage、Hotdog、Dreamweaver等。⑸“基本结构样板”在浏览器中显示如图4.2。基本语法超文本标识语言HTML是标识的集合，是标准通用标识语言SGML的一个子集。被一对尖括号“<”和“>”括起来，标识一般成对出现。如“基本结构样板”中的<HEAD>和</HEAD>，<HEAD>为起始标识，加斜线的<HEAD>即</HEAD>，为结束标识。

标识(Tags)和属性(Attributes)构建了HTML的语法。浏览器只要读到HTML的标识和属性，就会将其解释成网页或网页的某个组成部分，它们的基本构成如下：

⑴标识：标识就是给文档中某些具有特殊含义的部分作标记的过程，标识的符号(如：<BR>、<LI>、<H2>等等，常简称标识或标记)是该过程的具体实现。⑵属性：属性是存储属性值的变量。例句：⑶值：属性通常含有一个值(Value)，该值应在规定的范围内选取。⑷嵌套标识：在不同的网页版式设计中，可以使用一个以上的标识来表示页面的数据，例如：设置一个文本字串为：标题1、斜体，可以使用标识<H1>和<I>，例句如下：

<H1><I>岳阳楼记</I></H1>注意标识嵌套时的顺序不应交叉，下句则不对：

<H1><I>岳阳楼记</H1></I>从语法上来说该句是不对的，但IE和Netscape浏览器仍能正确识别和显示，即浏览器一般总能最大限度地容忍错误。不提倡使用嵌套标识。

⑸空格符：HTML标识间多余的空格符或回车符浏览器是不理会的。

⑹特殊字符：在HTML语言中定义了一些用户不能直接从键盘输入的特殊字符，如：字符（&）、双引号(“”)、小于(<)、大于(>)、空格符等，它们不能直接用于HTML文档在浏览器中显示。

常用标识1.基本标识(BasicTags)⑴<HTML></HTML>定义超文本文档，描述Web页面的起始与终止；⑵<HEAD></HEAD>设置页面的头标部分，用来包含当前文档的一些相关信息。如定义样式、网页的标题、网页中使用的脚本语言以及对搜索引擎有帮助的关键词；⑶<TITLE></TITLE>HTML文档均应该包含<TITLE>标识，用来指明文件的标题。其内容将显示在浏览器的标题栏内，设置它的最大好处，是为搜索引擎提供搜索关键词；⑷<BODY></BODY>放置Web页面的正文内容，包含文件内的文字、超级链接文字的颜色、背景色彩、图片、动画、影像、音效等，几乎所有对网页的展示功能；⑸<META>用来介绍与文件内容相关的信息。每一个<META>标识用于指明一个名称或数值对，常常放在头标识中；⑹<BASEhref=“URL”>设置连接的基准路径，该标识可以大大简化网页内超链接的全路径，这里只要给出相对于Base原指定的基准地址的相对路径即可。<BASE>为单标识，通常放在<HEAD>区内。2.文本、字符格式(Text&CharFormat)

⑴<Hn>标题文字(n=1～6)；⑵<BR>换行标识，单标识；⑶<P></P>定义段落（分段），常用双标识，也可用单个标识；⑷<PRE></PRE>在<PRE></PRE>之间的内容将以预格式化的文本方式显示，包括回车换行以及跳格等；⑸<HR>可以作为文本与文本之间的分界标识，通常是一个全宽的水平线；⑹字符格式；⑺字体。3.列表标识(Lists)⑴定义列表(DefinitionList)；<DL></DL>设定定义列表的标识<DT>设定定义列表的项目<DD>设定定义列表的项目说明<DLcompact>设定紧密排列的定义列表⑵无序号列表(UnorderedList)；<UL><LI>步骤一<LI>步骤二<P>下一阶段<LI>步骤三</UL>

⑶有序号列表(OrderedList)。<OL><LI>过程一<LI>过程二<OL><LI>子过程A<LI>子过程B</OL><LI>过程三</OL>

DHTML的概念

动态HTML就是一种即使在网页下载进浏览器以后，网页中元素的位置、外观、内容仍然能够随时变换，这样的HTML，我们称之为DHTML。动态HTML（简称为DHTML）是近年来网络发展进程中最振奋人心也最具实用性的创新之一。它的实现需要几种技术的综合。（当然，不同的浏览器，实现的程度也不同），这些技术包括CSS,DOM(DocumentObjectMode)，改变网页的编程语言（JavaScript，VBScript）。基于HTML语言，利用CSS扩展样式编排，借助浏览器对象模型概念，以脚本程序对网页进行动态控制文件对象模型DOM(DocumentObjectModel)其核心是将网页内容都作为对象。只要为HTML中的标记设定一个标识符(ID)，就可将所标识的内容作为对象在脚本程序中使用。传统的HTML是静态的，当它被加载到浏览器以后，无法变化DHTML-当服务器把页面传送给浏览器后，页面还可以变化DOM（文档对象模型）：工作原理：DHTML查阅文档的一种方法，当页面被加载时，建立起数据库控制元素的方法：使用脚本语言来完成DHTML与服务器无关DOM技术DOM概述一个跨平台的、可适应不同程序语言的文件对象模型；它采取直观且一致的方式，将HTML或XML文档进行模型化处理；提供存取和更新文档内容、结构和样式的编程接口。将文档作为一个树形（Tree）结构，树的每个节点表现为一个HTML标记或者HTML标记内的文本项。以下是一个产生表格的HTML文件。<table><tbody><tr><td>商品类别</td><td>数量</td> </tr><tr><td>日用百货</td><td>10</td></tr><tr><td>电器</td> <td>20</td></tr></tbody></table>文档与DOM关系示例HTML文件的DOM节点树

<tbody><tr><tr><tr><td><td><td><td><td><td>商品类别数量日用百货10电器20<table>DOM树型结构节点的属性属性访问说明nodeName只读返回节点的标记名。nodeType只读返回节点的类型：1—标记，2—属性，3—文字节点。firstChild只读返回第一个子节点的对象集合。lastChild只读返回最后一个子节点的对象集合。parentNode只读返回父节点对象。previousSibling只读返回左兄弟节点对象。nextSibling只读返回右兄弟节点对象。data读写文字节点的内容，其他节点返回undefined。nodeValue读写文字节点的内容，其他节点返回null。DOM中的2个对象集合：attributes：节点内容的对象集合；childNodes：子节点的对象集合。DOM树型结构节点的属性（续）DOM的方法使用DOM的方法生成一个表格<html><head><title>使用DOM生成表格</title><scriptlanguage="JavaScript">functiongenTable(pNode){vari,j;varcontents=newArray(3);for(i=0;i<3;i++)contents[i]=newArray(2);contents[0][0]="商品类别";contents[0][1]="数量";contents[1][0]="日用百货";contents[1][1]="10";contents[2][0]="电器";contents[2][1]="20";（续）vartableNode=document.createElement("TABLE");vartBodyNode=document.createElement("TBODY");for(i=0;i<3;i++){t1=document.createElement("TR");tBodyNode.appendChild(t1);for(j=0;j<2;j++){t1=document.createElement("TD");t2=document.createTextNode(contents[i][j]);t1.appendChild(t2);tBodyNode.childNodes[i].appendChild(t1);}}DHTML技术的核心—DOM

在某种意义上，DOM是动态HTML的真正核心内容。文档对象模型是HTML和XML的应用编程接口。它定义了文档的逻辑结构和访问文档的途径。DOM是为文档的编程API，它非常接近它模型化的文档结构理解DOM

DOM不是一个二进制的规范，用相同语言写的DOM程序，它的源程序可以跨平台兼容，但是DOM并没有定义任何二进制互操作的形式。DOM不是坚持把对象放到XML或HTML的方式。DOM规定了XML和HTML文档如何以对象形式表示，从而它们可以用在面向对象的程序中。DOM不是一套数据结构，而是规定接口的对象模型。虽然文档包含了显示parent/child关系的示意图，但这些只是由编程接口定义的逻辑关系，并不是任何特殊的内部数据结构的表示。

理解DOM（续）DOM并没有定义XML或HTML的“真正内部语义”。这些语言的语义是由W3C推荐的。DOM是被设计为尊重这些语义的编程模型。任何用这些语言写的文档可用DOM表示。DOM，与COM及CORBA不是一个概念，后者是规范对象和接口以实现语言无关的方式。DOM是被设计为管理HTML和XML文档的一套接口和对象。它的实现可用任何语言无关的系统（COM，CORBA）或用绑定在该文档上的特定语言如Java或ECMAScript。DOM最初的产生是作为允许JavaScriptscripts和Javaprograms在Webbrowsers间进行移植的规范。

CSS及CSS-PCascadingStyleSheets（层叠样式表）的缩写1996年底的时候悄悄诞生了一种叫做样式表（stylesheets）的技术。将对布局、字体、颜色、背景和其它文图效果实现更加精确的控制。--只通过修改一个文件就改变页数不定的网页的外观和格式。--在所有浏览器和平台之间的兼容性。--更少的编码、更少的页数和更快的下载速度。CSS所能改变的性质

字体

文字间的空间

列表颜色

背景

Margin

位置(CSS-P)QuestionCSS属于DOM的一部分，它的属性也可以通过动态HTML编写语言得到体现?AdvantageofCSS你可以将格式和结构分离。你可以以前所未有的能力控制页面布局。你可以制作体积更小下载更快的网页。你可以将许多网页同时更新，比以前快更容易。浏览器将成为你更友好的界面CSS,DOMandScriptCSS是你进行网页改变的对象，DOM是其具有变动性的机制，而Client-sideScripting是实际促成变化的程序。这，就是动态HTML。JavaScript的浏览器对象及其使用Window对象层次WindowNavigatorFrameDocumentLocationHistoryAnchorAppletAreaForm

ImageLinkButtonHiddenRadioSelectTextTextareaCheckboxPasswordResetSubmitNavigator对象主要用途用于判别客户浏览器的有关信息，以便针对不同浏览器的特性而设计不同的显示属性或方法名含义appName以字符串形式表示的浏览器名称。appVersion以字符串形式表示的浏览器版本信息，包括浏览器的版本号、操作系统名称等。appCodeName以字符串形式表示的浏览器代码名字，通常值为Mozilla。userAgent以字符串表示的完整的浏览器版本信息，包括了appName、appVersion和appCodeName的信息。mimeType在浏览器中可以使用的mime类型。plugins在浏览器中可以使用的插件(1)。javaEnabled()返回逻辑值，表示客户浏览器可否使用Java。（1）与窗口有关的属性(Window对象的实例)window、self：当前窗口；parent：当前窗口或帧（frame）的父窗口；

top：主窗口，是所有下级窗口的父窗口。*注意：引用时在它们的名称之前不能加上对象名（2）与浏览器状态栏有关的属性

status：浏览器当前状态栏显示的内容；

defaultStatus：浏览器状态栏显示的默认值

alert(字符串)：参数字符串为显示于对话框中的内容，无返回值。confirm(字符串)：参数字符串为显示于对话框中的内容，若用户按下“确定”按钮，返回true，否则返回mpt(字符串1,字符串2)：字符串1为显示于对话框中的内容，参数字符串2为输入的缺省内容；如用户按下“确定”按钮，返回用户在输入框中输入的字符串；否则，返回null。3.Window对象（续）（4）与窗口生成与撤消有关的方法生成一个新窗口open("URL","WindowName"[,"WindowFeatures"])

参数：URL：在新生成的窗口中载入的页面；

WindowName：新窗口的名字；WindowFeatures：表示新窗口的外观特征，可以指定多个特征值，各特征值之间以”,”相隔：特征值格式为：特征名=值返回：指向新窗口的指针关闭一个窗口：close()3.Window对象（续）窗口特征值表

time：重新执行expression的时间间隔,单位是毫秒.返回：一个标志，用以指示这个“超时”设置。清除指定的超时设置：clearTimeout(timeId)参数：timeID：由setTimeout返回的标志3.Window对象（续）VBScript的IE浏览器对象结构historynavigatorlocationeventscreenframedocumentdocumentdocumentWindow依次显示HTML文件中的各标记<html><head><title>显示文件中的各个标记</title><style> body{font-size:22px}</style></head><bodytopmargin=20><center><h1>依次显示文件中的各个标记</h1></center><hr><scriptlanguage=VBScript>Document.write"<br>"Fori=0toDocument.all.length-1Document.write" "&Document.all(i).tagName&"<br>"Next</script></body></html>（5）Document的对象数组（续）stylesheets：所有样式属性对象。属性：length方法：item()StyleSheet对象的主要方法：Document.StyleSheets(索引).addRule“标记名”,“样式规则”,“样式项目索引”Document.StyleSheets(索引).RemoveRule“样式项目索引”tagName属性InnerHTML属性style对象的属性属性设置格式：元素id.style.样式属性名＝属性的某值标记的属性输出/输入JavaScript的document对象提供了显示、消除、打开、关闭HTML页面信息的输出流，同时，JavaScript也可以使用Window对象的三个方法alert、confirm和prompt输出信息或数据，请见例5.26中的应用，方法的参数详情可参阅5.2.5节，与VBScript的方法类似，但要注意字母的大小写。

5.3.2注释与续行符JavaScript也有两种形式的注释：l

//注释内容l

/*…注释内容…*/JavaScript的过程和其他高级语言类似，JavaScript的函数也是一个拥有独立名字(在程序中惟一)的一系列JavaScript语句的有机组合。一个函数可以有自己的并可以在函数体内使用的参数。它的另一个作用是将JavaScript语句同Web页面相连接，任何一个用户的交互动作都可能引发一个事件，即间接地引起一个函数的调用，这样的调用又称事件处理(参见5.3.4节)。使用函数完成项目有一些好处：l

放在一个函数中的代码在程序中可以反复调用；l

用不同的函数来完成不同的功能，以函数来构造项目，可以使程序的结构清晰；l

可以将语句组成一个事件处理函数，并提供事件处理句柄供其他语句触发。⒈自定义函数⒉内置函数JavaScript的事件事件定义了用户与Web页面交互时产生的各种操作。浏览器在程序运行的大部分时间都等待交互事件的发生，并在事件发生时，自动调用事件处理函数，完成事件处理过程。如果在JavaScript脚本程序中注册一个事件处理函数，浏览器便可以在装入该页面时自动地执行这个函数。

例：<INPUTtype="button"value="执行"onclick="compute1(this.form)">⒈鼠标事件⒉键盘事件⒊浏览器事件⑴Load事件(发生在浏览器完成一个窗口或一组框架的装载之后)⑵Unload事件(发生在本浏览器载入一个新的网页之前，即离开本网页后)⑶dragdrop事件(发生在拖放一个对象到浏览器窗口中，IE不支持)⑷Submit事件(发生在完成信息输入，准备将信息提交给服务器处理时)

JavaScript的对象JavaScript实际上不完全支持面向对象的程序设计，只是一种基于对象的脚本语言。它支持开发对象类型以及根据这些对象产生一定数量的对象实例。同时它还支持开发对象的可重用性，以便实现一次开发多次使用的目的。1.内置对象①

Array对象(提供一个数组的模型，存储大量有序的数据)②

Date对象(处理日期和时间的存储、转化和表达)③

Event对象(提供对JavaScript事件的各种处理信息)④

Math对象(处理所有的数学运算)⑤

String对象(处理所有的字符串操作)

⒉

浏览器对象①anchors对象(为处理锚提供属性和方法)②document对象(提供对页面各种特性的设置)③forms对象(为处理表单或界面对象提供属性和方法)④frame对象(提供对框架特性的设置)⑤history对象(提供已访问过网页的URL地址)⑥links对象(为处理超链接提供属性和方法)⑦

location对象(给出当前网页的URL地址)⑧

navigation对象(提供浏览器版本号、运行平台、浏览器使用语言等)⑨

window对象(是脚本对象层次的最高层，代表着一个浏览器窗口)JavaScript的对象3.

对象创建在JavaScript中除了使用系统的对象以外，用户还可以创建自己的对象，其方法是创建一个构造函数：①定义一个构造函数用来说明这个对象的各种属性，并可对各属性初始化；②创建对象需要的各种方法，并在对象上注册这些方法；③使用new语句创建一个该对象的对象实例。例如：functionobjectName(property1,property2,…,propertyN){this.Property1=property1;perty2=property2;…pertyN=propertyN;this.registerMethod=registerMethod}//注册函数registerMethod注意，函数registerMethod必须事先已定义，作为对象的方法在此注册XSLTXSLT是ExtensibleStylesheetLanguageTransformations的缩写XSLT转换XML文档到其他通常使用的格式，一般是HTML文档XSLT使用两种文件(usestwoinputfiles:)XML文档包含实际的数据XSL文档包含显示框架（boththe“framework”inwhichtoinsertthedata,andXSLTcommandstodoso）很简单的例子文件data.xml:<?xmlversion="1.0"?>

<?xml-stylesheettype="text/xsl"href="render.xsl"?>

<message>Howdy!</message>

文件render.xsl:<?xmlversion="1.0"?>

<xsl:stylesheetversion="1.0”

xmlns:xsl="/1999/XSL/Transform">

<xsl:templatematch="/">

</body></html>

</xsl:template>

</xsl:stylesheet>.xsl文件一个XSLT文档使用.xsl作为文件后缀名XSLT文档使用以下的文件头:<?xmlversion="1.0"?><xsl:stylesheetversion="1.0"

xmlns:xsl="/1999/

XSL/Transform">包含一个或更多的templates,例如:<xsl:templatematch="/">...</xsl:template>使用下列语句来结束:</xsl:stylesheet>查找message文本Thetemplate<xsl:templatematch="/">saystoselecttheentirefileYoucanthinkofthisasselectingtherootnodeoftheXMLtreeInsidethistemplate,

<xsl:value-ofselect="message"/>selectsthemessagechildAlternativeXpathexpressionsthatwouldalsowork:

./message/message/text()(text()isanXPathfunction)./message/text()文件解读TheXSLwas:

<xsl:templatematch="/">

</body></html>

</xsl:template>

<xsl:templatematch=“/”>选择根节点

<h1>被写到输出文档Message的内容被写到输出文档中

</h1></body></html>被写到输出文档

Theresultantfilelookslike:

<h1>Howdy!</h1>

</body></html>XSLT如何工作XML文档被读入并存储为一棵节点树（isreadinandstoredasatreeofnodes）The<xsl:templatematch="/">templateisusedtoselecttheentiretreeTherules（规则）withinthetemplate（模版）areappliedtothematching（匹配）nodes,thuschangingthestructureoftheXMLtreeIfthereareothertemplates,theymustbecalledexplicitly（明确地）fromthemaintemplateUnmatchedpartsoftheXMLtreearenotchangedAfterthetemplateisapplied（应用）,thetreeiswrittenoutagainasatextdocumentXSLT应用范围使用适合的程序例如Xerces,XSLT能被用于阅读或写文档WEB应用服务器能使用XSLT在服务器端转换XML文档到HTML文档并送到客户端AmodernbrowsercanuseXSLTtochangeXMLintoHTMLontheclientsideThisiswhatwewillmostlybedoinginthisclassMostusersseldomupdatetheirbrowsersIfyouwant“everyone”toseeyourpages,doanyXSLprocessingontheserversideOtherwise,thinkaboutwhatbestfitsyoursituationModernbrowsersInternetExplorer6bestsupportsXMLNetscape6supportssomeofXMLInternetExplorer5.xsupportsanobsolete（过时的）versionofXMLIE5isnotgoodenoughforthiscourseIfyoumustuseIE5,theinitialPIisdifferent(youcanlookitupifyoueverneedit)xsl:value-of<xsl:value-ofselect=“XPathexpression”/>选择一个节点的内容并达到输出流中（selectsthecontentsofanelementandaddsittotheoutputstream）Theselectattribute（属性）isrequiredNoticethatxsl:value-ofisnotacontainer（容器）,henceitneedstoendwithaslash（/反斜杠）

Example(前面有的):<h1><xsl:value-ofselect="message"/></h1>xsl:for-eachxsl:for-eachisakindofloopstatement（循环语句）Thesyntax（语法）is

<xsl:for-eachselect="XPathexpression">

Texttoinsertandrulestoapply

</xsl:for-each>Example:toselecteverybook(//book)andmakeanunorderedlist(<ul>)oftheirtitles(title),use:

<ul>

<xsl:for-eachselect="//book">

</xsl:for-each>

</ul>过滤输出Youcanfilter(restrict)outputbyaddingacriteriontotheselectattribute’svalue:

<ul>

<xsl:for-eachselect="//book">

<li>

<xsl:value-of

select="title[../author='TerryPratchett']"/>

</li>

</xsl:for-each>

</ul>这段代码将输出作者是TerryPratchett的书名Filter（过滤器）detailsHereisthefilterwejustused:

<xsl:value-of

select="title[../author='TerryPratchett'"]/>authorisasibling（兄弟,姐妹,同胞,同属）oftitle,sofromtitlewehavetogouptoitsparent,book,thenbackdowntoauthorThisfilterrequiresaquote（引号）withinaquote,soweneedbothsinglequotesanddoublequotesLegalfilteroperatorsare:

=等于!=不等于<小于>大于Numbersshouldbequoted（被引号引起来）,butapparentlydon’thavetobe但是它不是我们需要的形式Here’swhatwedid:

<xsl:for-eachselect="//book">

<li>

<xsl:value-of

select="title[../author='TerryPratchett']"/>

</li>

</xsl:for-each>这段代码将所有的书都包含在<li>and</li>，所以除了TerryPratchett外其他书名都是空白Thereisnoobvious（明显）waytosolve（解决）thiswithjustxsl:value-ofxsl:ifxsl:ifallowsustoincludecontentifagivencondition(inthetestattribute)istrueExample:

<xsl:for-eachselect="//book">

<xsl:iftest="author='TerryPratchett'">

<li>

<xsl:value-ofselect="title"/>

</li>

</xsl:if>

</xsl:for-each>Thisdoesworkcorrectly!xsl:choose语句Thexsl:choose...xsl:when...xsl:otherwiseconstruct（结构）isXML’sequivalent（相等的）ofJava’sswitch...case...defaultstatement（语句）Thesyntaxis:

<xsl:choose>

<xsl:whentest="somecondition">

...somecode...

</xsl:when>

<xsl:otherwise>

...somecode...

</xsl:otherwise>

</xsl:choose>•xsl:chooseisoften

usedwithinan

xsl:for-eachloopxsl:sortYoucanplace（放置）anxsl:sortinside（在内部）anxsl:for-eachTheattributeofthesorttellswhatfieldtosort（索引）onExample:

<ul>

<xsl:for-eachselect="//book">

<xsl:sortselect="author"/>

<li><xsl:value-ofselect="title"/>by

<xsl:value-ofselect="author"></li>

</xsl:for-each>

</ul>这个例子建立了一个列表包含titlesandauthors,使用author排序。xsl:text<xsl:text>...</xsl:text>helpsdealwith（处理）twocommonproblems:XSLisn’tverycarefulwithwhitespace（空白）inthedocumentThisdoesn’tmattermuchforHTML,whichcollapses（忽视）allwhitespaceanyway(thoughtheHTMLsourcemaylookugly（丑陋）)<xsl:text>givesyoumuchbettercontroloverwhitespace;itactslikethe<pre>elementinHTMLSinceXMLdefinesonlyfiveentities,youcannotreadilyputotherentities(suchas

)inyourXSL 

almostworks,but

isvisibleonthepageHere’sthesecretformulaforentities:<xsl:textdisable-output-escaping="yes"> </xsl:text>从XML数据文件中创建属性（tag）假设XML中包含

<name>Dr.Dave'sHomePage</name>

<url>/~matuszek</url>你想变成下列HTML代码

<ahref="/~matuszek">

Dr.Dave'sHomePage</a>WeneedadditionaltoolstodothisItdoesn’tevenhelpiftheXMLdirectlycontains

<ahref="/~matuszek">

Dr.Dave'sHomePage</a>--westillcan’tmoveittotheoutputThesameproblemoccurswithimagesintheXML创建超链接（1）假设XMLcontains（包含）

<name>Dr.Dave'sHomePage</name>

<url>/~matuszek</url><xsl:attributename=“...”>

addsthenamedattributetotheenclosingtag（封闭的标记中）Thevalueoftheattributeisthecontentofthistag示例代码:<a>

<xsl:attributename="href">

<xsl:value-ofselect="url"/>

</xsl:attribute>

<xsl:value-ofselect="name"/>

</a>结果:<ahref="/~matuszek">

Dr.Dave'sHomePage</a>创建超链接（2）假设XMLcontains（包含）

<name>Dr.Dave'sHomePage</name>

<url>/~matuszek</url>Anattributevaluetemplate(AVT)consistsofbraces{}

insidetheattributevalueThecontentofthebracesisreplacedbyitsvalue示例代码<ahref="{url}">

<xsl:value-ofselect="name"/>

</a>结果:<ahref="/~matuszek">

Dr.Dave'sHomePage</a>模块化Modularization（模块化）--breakingupacomplexprogramintosimplerparts—是一种重要的编程思想Inprogramminglanguagesmodularizationisoftendonewithfunctions（函数，结构化编程）ormethods（方法，面向对象编程）InXSLwecandosomethingsimilarwith

xsl:apply-templatesForexample,supposewehaveaDTDforbookwithpartstitlePage,tableOfContents,chapter,andindexWecancreateseparatetemplatesforeachofthesepartsBookexample<xsl:templatematch="/">

<xsl:apply-templates/>

</body></html>

</xsl:template>

<xsl:templatematch="tableOfContents">

<h1>TableofContents</h1>

<xsl:apply-templatesselect="chapterNumber"/>

<xsl:apply-templatesselect="chapterName"/>

<xsl:apply-templatesselect="pageNumber"/>

</xsl:template>Etc.xsl:apply-templates元素The<xsl:apply-templates>elementapplies（应用）atemplaterule（规则）tothecurrentelementortothecurrentelement’schildnodesIfweaddaselectattribute,itappliesthetemplateruleonlytothechildthatmatchesIfwehavemultiple<xsl:apply-templates>elementswithselectattributes,thechildnodesareprocessedinthesameorderasthe<xsl:apply-templates>elements（按顺序应用规则）当templates被忽视Templatesaren’tusedunlesstheyareapplied例

人人文库> 全部分类> 教育资料 > 课件下载

温馨提示

1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

DOM文档对象模型

文档简介

温馨提示

最新文档

评论

DOM文档对象模型

文档简介

温馨提示

最新文档

评论

相关文档