複数のイメージを使用したXMLノード値へのアクセス

Question

返されるXMLには、サイズが異なる複数のイメージ値が返されます。私は自分のXSLで画像を読み込もうとしていますが、XMLで返される最小の（最初の）画像を常にピックするので、非常にピクセル化されています。

ブラウザの画面サイズに応じて、正しいものを選択するにはどうすればよいですか？最初のものは.icoでもかまいませんので、それはデスクトップ上では非常にピクセル化されています。

以下はXMLデータとXSLファイルのコードです。

XSL：

<xsl:for-each select="lfm/tracks/track"> 
     <xsl:sort order="descending" data-type="number" select="playcount"/> 
      <xsl:if test="position() &lt;= 8"> 
       <xsl:value-of select="result"/> 

         <div class="col s3 m3"> 
          <div class="card large"> 
           <div class="card-image"> 
            <img> 
            <xsl:attribute name="src"> 
             <xsl:value-of select="image"/> 
            </xsl:attribute> 
            </img> 

            <span class="card-title"><xsl:value-of select="name"/></span> 
           </div> 
           <div class="card-content"> 
            <p><xsl:value-of select="name"/> 
            </p> 

            <p><xsl:value-of select="artist/name"/> 
            </p> 

            <p> Playcount: 
             <xsl:value-of select="playcount"/> 
            </p> 
           </div> 

           <div class="card-action"> 
            <a href="view_song.html"><p>Link: 
             <xsl:value-of select="url"/> 
            </p></a> 
           </div> 
          </div> 
         </div> 


      </xsl:if> 
     </xsl:for-each> 

はXML：数の画像ノードを添字によって解決

<track> 
     <name>HUMBLE.</name> 
     <duration>0</duration> 
     <playcount>1063735</playcount> 
     <listeners>136852</listeners> 
     <mbid></mbid> 
     <url>https://www.last.fm/music/Kendrick+Lamar/_/HUMBLE.</url> 
     <streamable fulltrack="0">0</streamable> 
     <artist> 
      <name>Kendrick Lamar</name> 
      <mbid>381086ea-f511-4aba-bdf9-71c753dc5077</mbid> 
      <url>https://www.last.fm/music/Kendrick+Lamar</url> 
     </artist> 
     <image size="small">https://lastfm-img2.akamaized.net/i/u/34s/a4a35fcdf62b8a532039012653eeea14.png</image> 
     <image size="medium">https://lastfm-img2.akamaized.net/i/u/64s/a4a35fcdf62b8a532039012653eeea14.png</image> 
     <image size="large">https://lastfm-img2.akamaized.net/i/u/174s/a4a35fcdf62b8a532039012653eeea14.png</image> 
     <image size="extralarge">https://lastfm-img2.akamaized.net/i/u/300x300/a4a35fcdf62b8a532039012653eeea14.png</image> 
</track> 

Answer 1

<xsl:value-of select="image"/> 

imageのXPathが最初の画像にアクセスします素子。

他にアクセスする場合は、image[3]などの要素インデックスを使用するか、以下のようにsize属性を使用できます。

<xsl:value-of select="image[@size = 'large']"/> 

Answer 2

： <xsl:value-of select="image[2]"/>