翻出实习的一个小测试，用xml和xslt写的网页，感觉挺不错的，拿出来分享。
_ueditor_page_break_tag_
先是xslt代码：
<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns:msxsl="urn:schemas-microsoft-com:xslt" exclude-result-prefixes="msxsl"
>
<xsl:output method="html" indent="yes"/>
<xsl:template match="/">
<html>
<head>
<link rel="stylesheet" href="test.css" type="text/css" />
</head>
<body>
<script type="text/javascript">
function over(id)
{
var a=id.charAt(id.length - 1);
document.getElementById(id).className='bgcolorover';
document.getElementById("t"+a).className='rightDivOver';
}
function out(id)
{
var a=id.charAt(id.length - 1);
document.getElementById(id).className='bgcolorout';
document.getElementById("t"+a).className='rightDivOut';
}
var i=0;
function show()
{
i+=1;
if((i%2)==1)
document.getElementById("bottomStyle1").style.display="block";
else
document.getElementById("bottomStyle1").style.display="none";
}
</script>
<div class="headStyle">
<span class="headWord">
<xsl:value-of select="catalog/headword/title"/>
</span>
<span class="number">
<xsl:value-of select="catalog/headword/number"/>
</span>
<p>
<xsl:value-of select="catalog/headword/sort"/>
<span style="margin-left:10px">
<select name="" class="selectStyle">
<option class="option">
<xsl:value-of select="catalog/headword/mostrecent"/>
</option>
</select>
</span>
</p>
</div>
<div class="bodyStyle">
<xsl:for-each select ="catalog/topcomments/comments">
<div class="bgColor" onmouseover="over(this.id)" onmouseout="out(this.id)" onclick="show()">
<xsl:attribute name="id">
<xsl:value-of select="concat('events',position())"/>
</xsl:attribute>
<div class="topComments" >
<img class="imgStyle">
<xsl:attribute name="SRC">
<xsl:value-of select="img"/>
</xsl:attribute>
</img>
<span class="usernameStyle">
<xsl:value-of select="username"/>
</span>
<span class="timeStyle">
<xsl:value-of select="time"/>
</span>
<p class="contentStyleTop">
<xsl:value-of select="content"/>
</p>
</div>
<div class="rightDiv" id="rightDiv1">
<xsl:attribute name="id">
<xsl:value-of select="concat('t',position())"/>
</xsl:attribute>
<a href="#" class="hrefStyle">
<span>
<xsl:value-of select="reply"/>
</span>
</a>
<a href="#" class="hrefStyle">
<span class="spanBorder">
<xsl:value-of select="report"/>
</span>
</a>
</div>
</div>
</xsl:for-each>
<div class="bottomStyle" id="bottomStyle1">
<xsl:for-each select ="catalog/bottomcomments/comments">
<div class="bottomComments">
<img class="imgStyle">
<xsl:attribute name="SRC">
<xsl:value-of select="img"/>
</xsl:attribute>
</img>
<span class="usernameStyle">
<xsl:value-of select="username"/>
</span>
<span class="timeStyle">
<xsl:value-of select="time"/>
</span>
<p class="contentStyleBottom">
<xsl:value-of select="content"/>
</p>
</div>
</xsl:for-each>
</div>
</div>
</body>
</html>
</xsl:template>
</xsl:stylesheet>xml页面：
<?xml version="1.0" encoding="utf-8"?> <?xml-stylesheet type="text/xsl" href="XSLTFile.xsl"?> <catalog> <headword> <title>Comments</title> <number>(18)</number> <sort>Sort by:</sort> <mostrecent>Most recent</mostrecent> </headword> <topcomments> <comments> <img>img/001.jpg</img> <username>Caleigh27</username> <time>4:01PM</time> <reply>Reply</reply> <report>Report</report> <content>Lorem ipsum dolor amet,consectetur adipiscing elit.Suspendisse eget tortor.Inmi ante,pretium vel,imperdiet accumsan,viverra,viverra quis.</content> </comments> <comments> <img>img/002.jpg</img> <username>Username</username> <time>3:21PM</time> <content>Lorem ipsum dolor amet,consectetur adipiscing elit.Suspendisse eget tortor.Inmi ante,pretium vel,imperdiet accumsan,viverra,viverra quis.</content> <reply>Reply</reply> <report>Report</report> </comments> <comments> <img>img/003.jpg</img> <username>Username</username> <time>10/22/11 5:00PM</time> <content>Lorem ipsum dolor amet,consectetur adipiscing elit.Suspendisse eget tortor.Inmi ante,pretium vel,imperdiet accumsan,viverra,viverra quis.</content> <reply>Reply</reply> <report>Report</report> </comments> </topcomments> <bottomcomments> <comments> <img>img/004.jpg</img> <username>Username</username> <time>10/22/11 5:10PM</time> <content>Lorem ipsum dolor amet,consectetur adipiscing elit.Suspendisse eget tortor.Inmi ante,pretium vel,imperdiet accumsan,viverra,viverra quis.</content> </comments> <comments> <img>img/005.gif</img> <username>Username</username> <time>10/22/11 5:30PM</time> <content>Lorem ipsum dolor amet,consectetur adipiscing elit.Suspendisse eget tortor.Inmi ante,pretium vel,imperdiet accumsan,viverra,viverra quis.</content> </comments> </bottomcomments> </catalog>
演示页面：http://www.daidaiwa.com/Pro/XSLT/XMLFile.xml
