Question

I have the below XML file that i want to parse to create HTML. My problem is that i am not able to parse it as I would like.

What i want to do is output my <items> as html. So i want a <paragraph> to be a <div>, <image>to be an <img> and its child nodes to be its properties ‘src’ and ‘alt’.

<itemlist>
    <item>
        <paragraph>pA</paragraph>
        <image>
            <url>http://www.com/image.jpg</url>
            <title>default image</title>
        </image>
        <paragraph>pB</paragraph>
        <paragraph>pC</paragraph>
        <link target='#'>linkA</link>
        <paragraph>pD</paragraph>
        <link target='#' >linkB</link>
        <image>
            <url>http://www.com/image2.jpg</url>
            <title>default image 2</title>
        </image>
        </item>
        <item>      
        <paragraph>pB</paragraph>
        <paragraph>pC</paragraph>
        <image>
            <url>http://www.com/image2.jpg</url>
            <title>default image 2</title>
        </image>
        <link target='#'>linkA</link>
        <paragraph>pD</paragraph>
        <link target='#'>linkB</link>
        </item>
    </itemlist>

If I do a foreach loop on <item> and write values by applying the templates, such as match=’paragraph’ followed by match=’image’, then all <paragraph> will be written before the <image>, which will not result in correct output.

Below is the output that i am expecting. Anyone has an idea how to do it?

<div id="item">
    <div>pA</div>
    <img src='http://www.com/image.jpg' title='default image' />
    <div>pB</div>
    <div>pC</div>
    <a href='#'>linkA</a>
    <div>pD</div>
    <img src='http://www.com/image2.jpg' title='default image 2' />
</div>
<div id="item">
    <div>pB</div>
    <div>pC</div>
    <img src='http://www.com/image2.jpg' title='default image 2' />
    <a href='#'>linkA</a>
    <div>pD</div>
    <a href='#'>linkB</a>
</div>

—–edit—-
Currently I have something like this

    <xsl:for-each select="itemlist/item">
<xsl:apply-templates select="paragraph"/>
<xsl:apply-templates select="link"/>


  <xsl:template match="paragraph">
<xsl:value-of select="." />
  </xsl:template>

  <xsl:template match="link">
<xsl:value-of select="." />
  </xsl:template>


</xsl:for-each>

Answer 1

Is this what you are looking for ? :

<xsl:stylesheet version="1.0"
 xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
    <xsl:output method="xml" encoding="UTF-8" />

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

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

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

</xsl:stylesheet>