Menu

Generating Unique IDs and Linking to Them

October 3, 2001

Bob DuCharme

When an XSLT stylesheet converts one XML document into another, the ability to add unique ID values to elements in the result document can make the result document much more useful to applications that use it. Adding unique IDs can, for example, turn each element into the unique target of a link.

XSLT's generate-id() function generates a unique ID for a node passed to it as an argument. This ID starts with a letter so that you can use it as the value of an XML ID attribute. For example, the following stylesheet copies an XML document and adds a uid ("unique ID") attribute to each chapter, sect1, and sect2 element. The xsl:value-of instruction uses the generate-id() function in the stylesheet's first template rule to create a value for these attributes.

<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
     version="1.0">
<xsl:output method="xml" omit-xml-declaration="yes"/>

  <xsl:template match="chapter | sect1 | sect2">
    <xsl:copy>
      <xsl:attribute name="uid">
        <xsl:value-of select="generate-id(.)"/>
      </xsl:attribute>
      <xsl:apply-templates select="@*|node()"/>
    </xsl:copy>
  </xsl:template>

  <xsl:template match="@*|node()">
    <xsl:copy>
      <xsl:apply-templates select="@*|node()"/>
    </xsl:copy>
  </xsl:template>

</xsl:stylesheet>

The stylesheet turns this XML document

<chapter>
<para>Then with expanded wings he steers his flight</para>
<figure><title>"Incumbent on the Dusky Air"</title>
<graphic fileref="pic1.jpg"/></figure>
<para>Aloft, incumbent on the dusky Air</para>
<sect1>
<para>That felt unusual weight, till on dry Land</para>
<figure><title>"He Lights"</title>
<graphic fileref="pic2.jpg"/></figure>
<para>He lights, if it were Land that ever burned</para>
<sect2>
<para>With solid, as the Lake with liquid fire</para>
<figure><title>"The Lake with Liquid Fire"</title>
<graphic fileref="pic3.jpg"/></figure>
</sect2>
</sect1>
</chapter>

into this one:

<chapter uid="N134711680">
<para>Then with expanded wings he steers his flight</para>
<figure><title>"Incumbent on the Dusky Air"</title>
<graphic fileref="pic1.jpg"/></figure>
<para>Aloft, incumbent on the dusky Air</para>
<sect1 uid="N134683456">
<para>That felt unusual weight, till on dry Land</para>
<figure><title>"He Lights"</title>
<graphic fileref="pic2.jpg"/></figure>
<para>He lights, if it were Land that ever burned</para>
<sect2 uid="N134684064">
<para>With solid, as the Lake with liquid fire</para>
<figure><title>"The Lake with Liquid Fire"</title>
<graphic fileref="pic3.jpg"/></figure>
</sect2>
</sect1>
</chapter>

Your XSLT processor may generate different values with the generate-id() function. In fact, if you run the same stylesheet with the same input document a second time, the XSLT processor may not generate the same ID values that it generated the first time. However, if you call generate-id() more than once in one run with the same node as an argument, it generates the same ID value each time for that node. Because unique IDs are popular ways to identify link destinations, this consistency of the generate-id() function makes it a great way to generate links.

For example, we saw in an earlier "Transforming XML" column how to copy a document like the one above, adding a list of all of its illustrations at the beginning of the result document. If we make the result tree version an HTML file, we can use the generate-id function to turn each entry of this opening illustration list into an HTML link to the img element in the body of the document that has the illustration:

<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
     version="1.0">

  <xsl:output method="html"/>

  <xsl:template match="chapter">
    <html><body>

      <!-- Generate a list of picture titles, with each 
           title linking to the picture in the poem below. -->
      <b>Pictures:</b><br/>
      <xsl:for-each select="descendant::figure">
        <a href="#{generate-id(graphic)}">
        <xsl:value-of select="title"/></a><br/>
    </xsl:for-each>

    <xsl:apply-templates/>
    </body></html>
  </xsl:template>

  <xsl:template match="para">
    <p><xsl:apply-templates/></p>
  </xsl:template>

  <xsl:template match="graphic">
    <!-- Image and title as caption, centered. -->
    <center><a name="{generate-id(.)}"><img src="{@fileref}"/></a>
    <b><xsl:value-of select="../title"/></b></center>
  </xsl:template>

  <!-- Suppress figure title because "graphic" template
       rule already added it to result tree. -->
  <xsl:template match="figure/title"/>

</xsl:stylesheet>

With the source document above, this stylesheet creates the following HTML document:

<html>
    <body>
        <b>Pictures:</b>
        <br>
        <a href="#N134691840">"Incumbent on the Dusky Air"</a>
        <br>
        <a href="#N134692416">"He Lights"</a>
        <br>
        <a href="#N134757920">"The Lake with Liquid Fire"</a>
        <br>
<p>Then with expanded wings he steers his flight</p>

<center>
            <a name="N134691840"><img src="pic1.jpg"></a>
            <b>"Incumbent on the Dusky Air"</b>
        </center>
<p>Aloft, incumbent on the dusky Air</p>

<p>That felt unusual weight, till on dry Land</p>

<center>
            <a name="N134692416"><img src="pic2.jpg"></a>
            <b>"He Lights"</b>
        </center>
<p>He lights, if it were Land that ever burned</p>

<p>With solid, as the Lake with liquid fire</p>

<center>
            <a name="N134757920"><img src="pic3.jpg"></a>
            <b>"The Lake with Liquid Fire"</b>
        </center>


</body>
</html>

(To view the HTML document, you'll need to supply your own pic1.jpg, pic2.jpg, and pic3.jpg files.) The stylesheet uses the generate-id() ID twice:

    

Also in Transforming XML

Automating Stylesheet Creation

Appreciating Libxslt

Push, Pull, Next!

Seeking Equality

The Path of Control

  • As the xsl:for-each instruction in the "chapter" template rule adds each figure element's title to the result tree for the "Pictures:" list at the beginning of the result document, it puts each of these title elements inside of an HTML a element to link to the appropriate picture in the main part of the document. Each of these a elements has an href attribute to indicate the link destination. An href attribute that begins with a pound sign ("#") looks for the link destination in the same document -- specifically, it looks for another a element with a name attribute value equal to the part after the pound sign in the link origin. For example, an a start-tag of <a href="#a123"> links to an a element with an <a name="a123"> start-tag elsewhere in the same document.

    Instead of the string "a123" identifying each link destination, this stylesheet uses the generate-id() function to make up an identifying string. Because the graphic element node is passed to it as an argument, the function creates an ID string for each of the three graphic elements: "N134691840", "N134692416", and "N134757920".

  • To create the link destinations, the "graphic" template rule puts each HTML img element in the result tree inside of an a element. These img elements use the value of the source tree graphic elements' fileref attributes as their src value, and the a elements use the generate-id() function to create the values for their name attributes. Passing this function an argument of "." is the same as passing it self::node(), which in this case means passing it the graphic element node, so the XSLT processor generates an ID value for each graphic node. These are the same three nodes that the earlier use of the generate-id() created IDs for, and it creates the same three values: "N134691840", "N134692416", and "N134757920". When this HTML file is displayed in a browser, each link in the opening "Pictures:" list will now go to the corresponding picture in the document.

This consistency in the generate-id() function's treatment of a particular node, even if the function generates an ID for that node more than once, is the key to its power. These graphic elements didn't have IDs in the source document; with the help of this function, their equivalent in the result document has them, and other elements in that document use those IDs to link to them.