[原创]XSL学习心得 - 制作图像超链接

XSL学习心得 - 制作图像超链接[原创]
这是我今天学习的时候遇到的另一个问题,做图像超链接要把链接地址放到

 1<a>的href属性中去,可是这就是在标签中套标签,是不可以的,查了《Web编程实做教程》,才知道正确的解决方案,现在与大家分享。 
 2
 3此段代码运行需要两张图片:a.gif和b.gif。 
 4
 5**my.xml**   
 6**以下内容为程序代码:**   
 7  
 8<?xml version="1.0" encoding="GB2312"?>
 9<?xml-stylesheet type="text/xsl" href="mystyle.xsl"?>
10<books>
11<book id="a001">
12<name>网络指南</name>
13<photo>a.gif</photo>
14<homepage> http://www.a.com</homepage>
15</book>
16<book id="a002">
17<name>局域网技术</name>
18<photo>b.gif</photo>
19<homepage> http://www.b.com</homepage>
20</book>
21</books>   
22  
23---  
24  
25**mystyle.xsl**   
26**以下内容为程序代码:**   
27  
28<?xml version="1.0" encoding="GB2312"?>
29<xsl:stylesheet version="1.0" xmlns:xsl="  http://www.w3.org/1999/XSL/Transform">
30<xsl:template match="Books/Book">
31<xsl:element name="a">
32<xsl:attribute name="href">
33<xsl: -of="" _value_="" select="./Homepage"></xsl:>
34</xsl:attribute>
35<xsl:element name="img">
36<xsl:attribute name="src">
37<xsl: -of="" _value_="" select="./Photo"></xsl:>
38</xsl:attribute>
39</xsl:element>
40</xsl:element>
41</xsl:template>
42</xsl:stylesheet>   
43  
44---  
45  
46**在浏览器上的显示结果:**   
47竖向平列显示两个图片。 
48
49**说明:**   
50使用超链接,需要借助<xsl:element>和<xsl:attribute>两个标签,基本使用方法就可以参照上边的例子,在深奥一点的,如果你想出来了,记得要和大家分享哟。 ![](http://bbs.xml.org.cn/emot/em01.gif)
51
52![](http://bbs.xml.org.cn/face/face1.gif) ****   
53长见识,嘿嘿,这个可是真是第一次看见。   
54{Homepage}   
55<xsl: -of="" _value_="" select="Homepage"></xsl:>   
56两个在任何时候都是等价的吧? 
57
58你上边的代码和我原来的效果有点小差别,我帮你完善一下:   
59**mystyle.xsl**   
60<?xml version="1.0" encoding="GB2312"?>
61<xsl:stylesheet version="1.0" xmlns:xsl="  http://www.w3.org/1999/XSL/Transform">
62<xsl:template match="Books/Book">
63<a href="{Homepage}">
64<img src="{Photo}"/>
65</a>
66</xsl:template>
67</xsl:stylesheet>   
68  
69---</xsl:attribute></xsl:element></a>
Published At
Categories with Web编程
Tagged with
comments powered by Disqus