分享
 
 
 

xml应用(2): 通过向xsl传递参数+数据岛方式,实现在客户端单个xml的分框架显示

王朝other·作者佚名  2006-01-08
窄屏简体版  字體: |||超大  

对于数据较少的xml数据,可以使用一次下载完所有数据,将显示全部放到客户端完成

下面例子中,将一个xml文件显示为左右两个框架,左边显示条目,右边显示内容。

可以在本地,不用通过服务器解释.

关键:使用msxml的dom对象向xsl模板传递参数

环境: IE6 + Msxml3.0

examples:

/*** book.xml ***/

<?xml version="1.0" encoding="gb2312" ?>

<?xml-stylesheet type="text/xsl" href="book.xsl"?>

<moonpiazza>

<book ID="1">

<书名>基于XML 的 ASP.NET开发</书名>

<定价>42</定价>

<作者>Dan Wahlin/王宝良</作者>

</book>

<book ID="2">

<书名>XML应用的UML建模技术</书名>

<定价>32</定价>

<作者>David Carlson/周靖 侯奕萌 沈金河等</作者>

</book>

<book ID="3">

<书名>极限编程研究</书名>

<定价>70</定价>

<作者>Giancarrio Succi/Michele Marchesi/张辉(译)</作者>

</book>

<book ID="4">

<书名>Design Patterns</书名>

<定价>38</定价>

<作者>Erich Gamma/Richard Helm/Ralph Johnson/John Vlissides</作者>

</book>

</moonpiazza>

/*** book.xsl ***/

<?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>

:_)

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
2023年上半年GDP全球前十五强
 百态   2023-10-24
美众议院议长启动对拜登的弹劾调查
 百态   2023-09-13
上海、济南、武汉等多地出现不明坠落物
 探索   2023-09-06
印度或要将国名改为“巴拉特”
 百态   2023-09-06
男子为女友送行,买票不登机被捕
 百态   2023-08-20
手机地震预警功能怎么开?
 干货   2023-08-06
女子4年卖2套房花700多万做美容:不但没变美脸,面部还出现变形
 百态   2023-08-04
住户一楼被水淹 还冲来8头猪
 百态   2023-07-31
女子体内爬出大量瓜子状活虫
 百态   2023-07-25
地球连续35年收到神秘规律性信号,网友:不要回答!
 探索   2023-07-21
全球镓价格本周大涨27%
 探索   2023-07-09
钱都流向了那些不缺钱的人,苦都留给了能吃苦的人
 探索   2023-07-02
倩女手游刀客魅者强控制(强混乱强眩晕强睡眠)和对应控制抗性的关系
 百态   2020-08-20
美国5月9日最新疫情:美国确诊人数突破131万
 百态   2020-05-09
荷兰政府宣布将集体辞职
 干货   2020-04-30
倩女幽魂手游师徒任务情义春秋猜成语答案逍遥观:鹏程万里
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案神机营:射石饮羽
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案昆仑山:拔刀相助
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案天工阁:鬼斧神工
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案丝路古道:单枪匹马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:与虎谋皮
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:李代桃僵
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:指鹿为马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:小鸟依人
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:千金买邻
 干货   2019-11-12
 
推荐阅读
 
 
 
>>返回首頁<<
 
靜靜地坐在廢墟上,四周的荒凉一望無際,忽然覺得,淒涼也很美
© 2005- 王朝網路 版權所有