使用XML与XSLT筛选页面显示的内容

最新推荐文章于 2016-05-20 00:45:59 发布

weixin_30341735

最新推荐文章于 2016-05-20 00:45:59 发布

阅读量151

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/JiaweiZONE/archive/2005/11/12/274580.html

版权

前段时间刚学了XML和XSLT，作为练习，我用XML和XSLT结合JavaScript写了一个实现页面内容筛选显示，这样在做一些基本的数据处理时就不需要重新载入页面了，提高了效率。

代码如下：

<? xml version="1.0" encoding="GB2312" ?>
2

< xs:schema xmlns:xs ="http://www.w3.org/2001/XMLSchema" elementFormDefault ="qualified" attributeFormDefault ="unqualified" >
3

< xs:element name ="PoemList" >
4

< xs:complexType >
5

< xs:sequence >
6

< xs:element name ="Poem" minOccurs ="1" maxOccurs ="unbounded" >
7

< xs:complexType >
8

< xs:sequence >
9

< xs:element name ="Title" />
10

< xs:element name ="Write" />
11

< xs:element name ="Text" >
12

< xs:complexType >
13

< xs:sequence >
14

15

< xs:element name ="Line" minOccurs ="1" maxOccurs ="unbounded" />
16

</ xs:sequence >
17

</ xs:complexType >
18

</ xs:element >
19

< xs:element name ="Mean" />
20

</ xs:sequence >
21

< xs:attribute name ="Type" type ="xs:string" use ="required" />
22

</ xs:complexType >
23

</ xs:element >
24

</ xs:sequence >
25

</ xs:complexType >
26

</ xs:element >
27

</ xs:schema >
28

<? xml version="1.0" encoding="UTF-8" ?>
2

< xsl:stylesheet version ="2.0" xmlns:xsl ="http://www.w3.org/1999/XSL/Transform" xmlns:xs ="http://www.w3.org/2001/XMLSchema" xmlns:fn ="http://www.w3.org/2005/xpath-functions" xmlns:xdt ="http://www.w3.org/2005/xpath-datatypes" >
3

< xsl:output version ="1.0" encoding ="GB2312" indent ="no" omit-xml-declaration ="no" media-type ="text/html" />
4

< xsl:template match ="/" >
5

< html >
6

< head >
7

< title > SelectPoem </ title >
8

< script language ="javascript" >
9

function selectPoem(write,selectedIndex) {
10

stylesheet = document.XSLDocument;
11

xmldoc = document.XMLDocument;
12

selectField = stylesheet.selectSingleNode("//xsl:if/@test");
13

if( write == "全部" )
15

selectField.value = "Write=*";
16

else
17

selectField.value = "Write='" + write + "'";
18

PoemList.innerHTML = xmldoc.documentElement.transformNode(stylesheet);
20

document.SelectPoemForm.SelectPoemList.selectedIndex = selectedIndex;
21

}
22

</ script >
23

</ head >
24

< body >
25

< br />
26

< div id ="PoemList" >
27

< xsl:apply-templates select ="PoemList" />
28

</ div >
29

</ body >
30

</ html >
31

</ xsl:template >
32

< xsl:template match ="PoemList" >
33

< table align ="center" border ="0" >
34

< thead >
35

< tr align ="center" >
36

< td align ="center" height ="39" >
37

< h1 > 唐   诗 </ h1 >
38

</ td >
39

</ tr >
40

</ thead >
41

< tbody >
42

< tr >
43

< td align ="center" >
44

< form name ="SelectPoemForm" >
45

作者:
46

< select id ="SelectPoemList" name ="SelectPoem" class ="droplist" onChange ="selectPoem(this.options[selectedIndex].text,selectedIndex);" >
47

< option > 全部 </ option >
48

< xsl:for-each select ="Poem" >
49

< option >
50

< xsl:value-of select ="Write" />
51

</ option >
52

</ xsl:for-each >
53

</ select >
54

</ form >
55

< hr color ="black" size ="2" />
56

< br />
57

< xsl:for-each select ="Poem" >
58

< xsl:if test ="Write=*" >
59

< table align ="center" border ="0" >
60

< tbody >
61

< tr align ="center" valign ="middle" >
62

< td align ="center" height ="2" valign ="center" width ="350" >
63

< span style ="font-size:larger; font-weight:bold; " >
64

< xsl:value-of select ="Title" />
65

</ span >
66

</ td >
67

< td height ="2" rowspan ="3" width ="1" ></ td >
68

< td align ="left" height ="2" rowspan ="2" width ="350" > 类型: < xsl:value-of select ="@Type" />
69

</ td >
70

</ tr >
71

< tr >
72

< td align ="center" width ="350" >
73

< span style ="font-size:smaller; " >
74

< xsl:value-of select ="Write" />
75

</ span >
76

</ td >
77

</ tr >
78

< tr align ="center" >
79

< td align ="center" valign ="center" width ="350" >
80

< xsl:for-each select ="Text" >
81

< br />
82

< xsl:for-each select ="Line" >
83

< xsl:value-of select ="." />
84

< br />
85

</ xsl:for-each >
86

< br />
87

</ xsl:for-each >
88

< br />
89

</ td >
90

< td align ="left" height ="20" rowspan ="2" valign ="center" width ="350" >
91

< xsl:value-of select ="Mean" />
92

</ td >
93

</ tr >
94

</ tbody >
95

</ table >
96

< hr color ="#E8E8E8" size ="1" />
97

< br />
98

</ xsl:if >
99

</ xsl:for-each >
100

< br />
101

< hr color ="black" size ="2" />
102

< br />
103

</ td >
104

</ tr >
105

</ tbody >
106

</ table >
107

</ xsl:template >
108

</ xsl:stylesheet >

<? xml version="1.0" encoding="GB2312" ?>
2

<? xml-stylesheet type="text/xsl" href="SelectPoem.xslt" ?>
3

< PoemList xmlns:xsi ="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation ="SelectPoem.xsd" >
4

< Poem Type ="七言绝句" >
5

< Title > 送孟浩然之广陵 </ Title >
6

< Write > 李白 </ Write >
7

< Text >
8

< Line > 故人西辞黄鹤楼，烟花三月下扬州。 </ Line >
9

< Line > 孤帆远影碧空尽，惟见长江天际流。 </ Line >
10

</ Text >
11

< Mean >
12

老朋友孟浩然，辞别西楚的黄鹤楼；
13

阳春三月烟花如海，他去游历扬州。
14

一叶孤舟，远远地消失在碧空尽头；
15

只见浩浩荡荡的长江，向天际奔流！
16

</ Mean >
17

</ Poem >
18

< Poem Type ="七言绝句" >
19

< Title > 江南逢李龟年 </ Title >
20

< Write > 杜甫 </ Write >
21

< Text >
22

< Line > 岐王宅里寻常见，崔九堂前几度闻。 </ Line >
23

< Line > 正是江南好风景，落花时节又逢君。 </ Line >
24

</ Text >
25

< Mean >
26

当年在岐王宅里，常常见到你的演出；
27

在崔九堂前，也曾多次欣赏你的艺术。
28

没有想到，在这风景一派大好的江南；
29

正是落花时节，能巧遇你这位老相熟。
30

</ Mean >
31

</ Poem >
32

< Poem Type ="五言律诗" >
33

< Title > 送杜少府之任蜀州 </ Title >
34

< Write > 王勃 </ Write >
35

< Text >
36

< Line > 城阙辅三秦，风烟望五津。 </ Line >
37

< Line > 与君离别意，同是宦游人。 </ Line >
38

< Line > 海内存知己，天涯若比邻。 </ Line >
39

< Line > 无为在岐路，儿女共沾巾。 </ Line >
40

</ Text >
41

< Mean >
42

古代三秦之地，拱护长安城垣宫阙。
43

风烟滚滚，望不到蜀州岷江的五津。
44

与你握手作别时，彼此间心心相印；
45

你我都是远离故乡，出外做官之人。
46

四海之内只要有了你，知己啊知己，
47

不管远隔在天涯海角，都象在一起。
48

请别在分手的岐路上，伤心地痛哭；
49

象多情的少年男女，彼此泪落沾衣。
50

</ Mean >
51

</ Poem >
52

< Poem Type ="七言乐府诗" >
53

< Title > 出塞 </ Title >
54

< Write > 王昌龄 </ Write >
55

< Text >
56

< Line > 秦时明月汉时关，万里长征人未还。 </ Line >
57

< Line > 但使龙城飞将在，不教胡马渡阴山。 </ Line >
58

</ Text >
59

< Mean >
60

依旧是秦时的明月汉时的边关，
61

征战长久延续万里征夫不回还。
62

倘若龙城的飞将李广而今健在，
63

绝不许匈奴南下牧马度过阴山。
64

</ Mean >
65

</ Poem >
66

</ PoemList >
67

转载于:https://www.cnblogs.com/JiaweiZONE/archive/2005/11/12/274580.html

weixin_30341735

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
使用XML与XSLT筛选页面显示的内容

前段时间刚学了XML和XSLT，作为练习，我用XML和XSLT结合JavaScript写了一个实现页面内容筛选显示，这样在做一些基本的数据处理时就不需要重新载入页面了，提高了效率。代码如下：1<?xmlversion="1.0"encoding="GB2312"?>2<xs:schemaxmlns:xs="http://www.w3.org/2001/...
复制链接

扫一扫