對于數據較少的xml數據，可以使用一次下載完所有數據，將顯示全部放到客戶端完成，下面例子中，將一個xml文件顯示為左右兩個框架，左邊顯示條目，右邊顯示內容?？梢栽诒镜?，不用通過服務器解釋.
<?xml version="1.0" encoding="gb2312"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/xsl/transform">
<xsl:template match="/">
<html>
<head>
<script language="javascript">
<xsl:comment>
<![cdata[
var m_oxsl ;
var m_sframeattr_left, m_sframeattr_main ;
var m_sxmlfile, m_sxsltfile ;
m_sxmlfile = "" ;
m_sxsltfile = "book_view.xsl"; // 指定xsl文件
function window.onload()
{
var oxsldoc ;
m_sframename_left = "left_frame";
m_sframename_main = "main_frame";
m_oxsl = new activexobject("msxml2.xsltemplate.3.0");
oxsldoc = new activexobject("msxml2.freethreadeddomdocument.3.0");
oxsldoc.async = false;
oxsldoc.load(m_sxsltfile);
m_oxsl.stylesheet= oxsldoc;
initpage() ;
}
function initpage()
{
content.cols = "270,*" ;
viewframe(m_sframename_left);
var shtmlstr = "請選擇書目...";
eval(m_sframename_main + ".document").open ("text/html","gb2312");
eval(m_sframename_main + ".document").write(shtmlstr) ;
}
function viewframe(p_sframename)
{
var oxslproc;
var shtmlstr;
oxslproc = m_oxsl.createprocessor();
oxslproc.input = xmldata;
// 指定參數,顯示左(或右)框架
oxslproc.addparameter("framename_left", m_sframename_left);
oxslproc.addparameter("framename_main", m_sframename_main);
oxslproc.addparameter("framename", p_sframename);
oxslproc.transform();
shtmlstr = oxslproc.output ; // 獲得轉化后的字符串
eval(p_sframename + ".document").open ("text/html","gb2312");
eval(p_sframename + ".document").write(shtmlstr) ;
}
function viewdata(p_sdataid)
{
var oxslproc;
var shtmlstr;
oxslproc = m_oxsl.createprocessor();
oxslproc.input = xmldata;
// 指定參數,顯示id為 p_sdataid 的數據
oxslproc.addparameter("framename_left", m_sframename_left);
oxslproc.addparameter("framename_main", m_sframename_main);
oxslproc.addparameter("framename", m_sframename_main);
oxslproc.addparameter("dataid", p_sdataid);
oxslproc.transform();
shtmlstr = oxslproc.output ; // 獲得轉化后的字符串
eval(m_sframename_main + ".document").open ("text/html","gb2312");
eval(m_sframename_main + ".document").write(shtmlstr) ;
}
]]>
</xsl:comment>
</script>
</head>
<xml id="xmldata">
<xsl:copy-of select="*" />
</xml>
<frameset cols="0,*" name="content">
<frame name="left_frame" src="about:blank" />
<frame name="main_frame" src="about:blank" />
</frameset>
</html>
</xsl:template>
</xsl:stylesheet>
/*** book_view.xsl ***/
<?xml version="1.0" encoding="gb2312"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/xsl/transform">
<xsl:param name="framename_left" select="'left_frame_null'" />
<xsl:param name="framename_main" select="'main_frame_null'" />
<xsl:param name="framename" select="''" />
<xsl:param name="dataid" select="''" />
<xsl:template match="/">
<html>
<head>
<style type="text/css">
body
{
font-size:9pt;
}
td
{
font-size:9pt;
}
a{
font-size:9pt;
}
</style>
</head>
<xsl:choose>
<xsl:when test="$framename = $framename_left">
<xsl:call-template name="left_frame" />
</xsl:when>
<xsl:when test="$framename = $framename_main">
<xsl:call-template name="main_frame" />
</xsl:when>
</xsl:choose>
</html>
</xsl:template>
<xsl:template name="left_frame">
<xsl:for-each select="moonpiazza/book">
<xsl:element name="a">
<xsl:attribute name="href">
javascript:parent.viewdata(<xsl:value-of select="@id" />);
</xsl:attribute>
<xsl:value-of select="書名" />
</xsl:element>
<br/>
</xsl:for-each>
</xsl:template>
<xsl:template name="main_frame">
<xsl:choose>
<xsl:when test="$dataid != ''">
<table border="1" width="500">
<xsl:for-each select="moonpiazza/book[@id = $dataid]/*">
<tr>
<td width="70"><xsl:value-of select="name()" /></td>
<td><xsl:value-of select="." /></td>
</tr>
</xsl:for-each>
</table>
</xsl:when>
</xsl:choose>
</xsl:template>
</xsl:stylesheet>
