• 首页
• 域名注册
• 虚拟主机
• 网站建设
• 服务器租用
• 营销推广
• 网站程序
• 前端开发
• 移动互联网
• 企业邮箱

• 当前位置：创新互联 >> 常见问题 >> 前端开发 >> XML教程 >> XSL学习心得-制作图像超链接

XSL学习心得-制作图像超链接

• 作者：创新互联 文章来源：前端开发部 点击数： 更新时间：2008-08-13
• 　　做图像超链接要把链接地址放到<a>的href属性中去，可是这就是在标签中套标签，是不可以的，查了《Web编程实做教程》，才知道正确的解决方案，现在与大家分享。
  　　此段代码运行需要两张图片：a.gif和b.gif。
  my.xml
  以下内容为程序代码:
  <?xml version="1.0" encoding="GB2312"?>
  <?xml-stylesheet type="text/xsl" href="mystyle.xsl"?>
  <Books>
      <Book ID="a001">
          <Name>网络指南</Name>
          <Photo>a.gif</Photo>
          <Homepage>http://www.a.com</Homepage>
      </Book>
      <Book ID="a002">
          <Name>局域网技术</Name>
          <Photo>b.gif</Photo>
          <Homepage>http://www.b.com</Homepage>
      </Book>
  </Books>
  mystyle.xsl
  以下内容为程序代码:
  <?xml version="1.0" encoding="GB2312"?>
  <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
      <xsl:template match="Books/Book">
          <xsl:element name="a">
              <xsl:attribute name="href">
                  <xsl:value-of select="./Homepage"/>
              </xsl:attribute>
              <xsl:element name="img">
                  <xsl:attribute name="src">
                      <xsl:value-of select="./Photo"/>
                  </xsl:attribute>
              </xsl:element>
          </xsl:element>
          <br/>
      </xsl:template>
  </xsl:stylesheet>
   
  浏览器上的显示结果：
  竖向平列显示两个图片。
  说明：
  使用超链接，需要借助<xsl:element>和<xsl:attribute>两个标签，基本使用方法就可以参照上边的例子，在深奥一点的，如果你想出来了，记得要和大家分享哟。 
  {Homepage}
  <xsl:value-of select="Homepage"/>
  
  mystyle.xsl
  <?xml version="1.0" encoding="GB2312"?>
  <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
      <xsl:template match="Books/Book">
          <a href="{Homepage}">
              <img src="{Photo}"/>
          </a>
      </xsl:template>
  </xsl:stylesheet>
• XML和XSLT结合使网站设计浑然一体 :上一篇
  什么是XML :下一篇