将Javascript应用于XSL
我注意到，如果我试图通过java脚本将更改应用于XSL文件，它只会影响XSL创建的最顶层节点 例如： 我想隐藏多个博客条目的所有评论。结果只有最上面的博客条目会隐藏评论 我想更改超链接的文本。超链接文本将仅在最顶端的节点中更改 如何让java脚本影响XSL文件创建的所有节点 HTML代码：将Javascript应用于XSL,javascript,html,xslt,Javascript,Html,Xslt,我注意到，如果我试图通过java脚本将更改应用于XSL文件，它只会影响XSL创建的最顶层节点 例如： 我想隐藏多个博客条目的所有评论。结果只有最上面的博客条目会隐藏评论 我想更改超链接的文本。超链接文本将仅在最顶端的节点中更改 如何让java脚本影响XSL文件创建的所有节点 HTML代码： <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <h
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css" >
<title>My Blog</title>
<script>
function loadXMLDoc(fname)
{
var xmlDoc;
// code for IE
if (window.ActiveXObject)
{
xmlDoc = new ActiveXObject("MSXML2.FreeThreadedDOMDocument");
}
// code for Mozilla, Firefox, Opera, etc.
else if (document.implementation.createDocument)
{
xmlDoc = document.implementation.createDocument("", "", null);
}
else
{
alert('Your browser cannot handle this script');
}
xmlDoc.async=false;
xmlDoc.load(fname);
return(xmlDoc);
}
function loadEntries()
{
xmlDoc = loadXMLDoc("blogData.xml");
xslDoc = loadXMLDoc("blogData.xsl");
// for Firefox, Safari, etc.
if (document.implementation.createDocument)
{
var xsltProcessor = new XSLTProcessor();
xsltProcessor.importStylesheet(xslDoc);
xsltProcessor.setParameter(null, "id", 11);
var resultDocument = xsltProcessor.transformToFragment(xmlDoc,document);
document.getElementById("entries").appendChild(resultDocument);
}
// Internet Explorer
else if (window.ActiveXObject)
{
var xslTemplate=new ActiveXObject("MSXML2.XSLTemplate");
xslTemplate.stylesheet=xslDoc;
var xslProc = xslTemplate.createProcessor();
xslProc.input = xmlDoc;
xslProc.addParameter("id", 11);
xslProc.transform();
document.getElementById("entries").innerHTML = xslProc.output;
}
}
function displayResult()
{
var xml=loadXMLDoc("blogData.xml");
var xsl=loadXMLDoc("blogData.xsl");
// code for IE
if (window.ActiveXObject)
{
var ex = xml.transformNode(xsl);
document.getElementById("entries").innerHTML = ex;
document.getElementById("comments").style.display = 'none';
document.getElementById("hideShowLink").innerHTML = 'Show Comments';
}
// code for Mozilla, Firefox, Opera, etc.
else if (document.implementation.createDocument)
{
var xsltProcessor = new XSLTProcessor();
xsltProcessor.importStylesheet(xsl);
var resultDocument = xsltProcessor.transformToFragment(xml,document);
document.getElementById("entries").appendChild(resultDocument);
document.getElementById("comments").style.display = 'none';
document.getElementById("hideShowLink").innerHTML = 'Show Comments';
}
}
function hideShow(){
if(document.getElementById("comments").style.display == 'none'){
document.getElementById("comments").style.display = 'block';
document.getElementById("hideShowLink").innerHTML = 'Hide Comments';
} else {
document.getElementById("comments").style.display = 'none';
document.getElementById("hideShowLink").innerHTML = 'Show Comments';
}
}
</script>
</head>
<body onLoad="displayResult()">
<table width="100%" border="0">
<tr>
<td colspan="2">
<div class="imgcentered">
<img src="banner.gif" alt="banner" />
</div>
</td>
</tr>
<tr>
<td>
<div id="entries">
</div>
</td>
<td class="rightside">
<div class="rightbody">
<ul>
<li><a href="index.html">Home</a></li>
<li>Archives</li>
<li>Profile
<br/>
<img src="pokemon.gif" alt="pokemin" width="40%"/><br/>
<br/>
<dl>
<dt><b>Name:</b></dt>
<dd>Ash Catchem</dd>
<dt><b>Age:</b></dt>
<dd>Old Enough</dd>
<dt><b>Birth Place:</b></dt>
<dd>Pallet Town</dd>
<dt><b>Current Residence:</b></dt>
<dd>Kanto</dd>
<dt><b>Occupation:</b></dt>
<dd>Pokemon Catcher</dd>
</dl>
</li>
</ul>
</div>
</td>
</tr>
</table>
</body>
</html>
我的博客
函数loadXMLDoc（fname）
{
var-xmlDoc；
//IE代码
if（window.ActiveXObject）
{
xmlDoc=新的ActiveXObject（“MSXML2.FreeThreadedDOMDocument”）；
}
//Mozilla、Firefox、Opera等的代码。
else if（document.implementation.createDocument）
{
xmlDoc=document.implementation.createDocument（“，”，null）；
}
其他的
{
警报（“您的浏览器无法处理此脚本”）；
}
xmlDoc.async=false；
加载（fname）；
退货（xmlDoc）；
}
函数loadEntries（）
{
xmlDoc=loadXMLDoc（“blogData.xml”）；
xslDoc=loadXMLDoc（“blogData.xsl”）；
//用于Firefox、Safari等。
if（document.implementation.createDocument）
{
var xsltProcessor=new xsltProcessor（）；
xsltProcessor.importStylesheet（xslDoc）；
setParameter（null，“id”，11）；
var resultDocument=xsltProcessor.transformToFragment（xmlDoc，document）；
document.getElementById（“条目”）.appendChild（resultDocument）；
}
//Internet Explorer
else if（window.ActiveXObject）
{
var xslTemplate=newActiveXObject（“MSXML2.xslTemplate”）；
xslTemplate.stylesheet=xslDoc；
var xslProc=xslTemplate.createProcessor（）；
xslProc.input=xmlDoc；
xslProc.addParameter（“id”，11）；
xslProc.transform（）；
document.getElementById（“条目”）.innerHTML=xslProc.output；
}
}
函数displayResult（）
{
var xml=loadXMLDoc（“blogData.xml”）；
var xsl=loadXMLDoc（“blogData.xsl”）；
//IE代码
if（window.ActiveXObject）
{
var ex=xml.transformNode（xsl）；
document.getElementById（“条目”）.innerHTML=ex；
document.getElementById（“comments”）.style.display='none'；
document.getElementById（“hideShowLink”）.innerHTML='showcoments'；
}
//Mozilla、Firefox、Opera等的代码。
else if（document.implementation.createDocument）
{
var xsltProcessor=new xsltProcessor（）；
导入样式表（xsl）；
var resultDocument=xsltProcessor.transformToFragment（xml，文档）；
document.getElementById（“条目”）.appendChild（resultDocument）；
document.getElementById（“comments”）.style.display='none'；
document.getElementById（“hideShowLink”）.innerHTML='showcoments'；
}
}
函数hideShow（）{
if（document.getElementById（“comments”）.style.display=='none'）{
document.getElementById（“comments”）.style.display='block'；
document.getElementById（“hideShowLink”）.innerHTML='Hide Comments'；
}否则{
document.getElementById（“comments”）.style.display='none'；
document.getElementById（“hideShowLink”）.innerHTML='showcoments'；
}
}
- 档案
- 侧面图
姓名：
灰烬
年龄：
够大了
出生地：
托盘镇
现居地：
关东
职业：
口袋妖怪捕手
<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html>
<body>
<div class="leftbody">
<!-- Loops Through all of the entries node in the XML and displays then in order by date descending order -->
<xsl:for-each select="//entries">
<xsl:sort select="creationTime/@sort" order="descending" />
<p><xsl:value-of select="creationTime"/>[<a href="javascript:hideShow()"> <xsl:value-of select="count(comments)"/> Comments</a>]</p>
<h1><xsl:value-of select="title"/></h1>
<p><xsl:value-of select="description"/></p>
<br/>
<p><a href="javascript:hideShow()" id="hideShowLink" class="comments"></a></p>
<br/><hr/><br/>
<div id="comments" class="comments">
<h2>Comments:</h2>
<xsl:for-each select="//comments">
<p class="comments"><h3><xsl:value-of select="title"/></h3></p>
<p class="comments"><xsl:value-of select="description"/></p>
<p class="comments">-- <xsl:value-of select="creator"/></p>
</xsl:for-each>
<hr/>
</div>
</xsl:for-each>
</div>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
[]
评论：
--
<xsl:for-each select="//entries">
<xsl:sort select="creationTime/@sort" order="descending" />
<!-- define variables -->
<xsl:variable name="unique-id">
<xsl:choose>
<xsl:when test="position() = 1">
<xsl:value-of select="''"/>
</xsl:when>
<xsl:otherwise>
<xsl:value-of select="generate-id(.)"/>
</xsl:otherwise>
</xsl:choose>
</xsl:variable>
<xsl:variable name="comments-id" select="concat('comments',$unique-id)"/>
<xsl:variable name="hideShowLink-id" select="concat('hideShowLink',$unique-id)"/>
<xsl:variable name="a-href" select="concat('javascript:hideShow("',$unique-id,'")')"/>
<!-- title and description -->
<p><xsl:value-of select="creationTime"/>[<xsl:element name="a"><xsl:attribute name="href"><xsl:value-of select="$a-href"/></xsl:attribute> <xsl:value-of select="count(comments)"/> Comments</xsl:element>]</p>
<h1><xsl:value-of select="title"/></h1>
<p><xsl:value-of select="description"/></p>
<br/>
<p>
<xsl:element name="a">
<xsl:attribute name="id"><xsl:value-of select="$hideShowLink-id"/></xsl:attribute>
<xsl:attribute name="href"><xsl:value-of select="$a-href"/></xsl:attribute>
<xsl:attribute name="class"><xsl:value-of select="'comments'"/></xsl:attribute>
Show Comments
</xsl:element>
</p>
<br/><hr/><br/>
<!-- comments -->
<xsl:element name="div">
<xsl:attribute name="id"><xsl:value-of select="$comments-id"/></xsl:attribute>
<xsl:attribute name="class"><xsl:value-of select="'comments'"/></xsl:attribute>
<xsl:attribute name="style"><xsl:value-of select="'display:none'"/></xsl:attribute>
<h2>Comments:</h2>
<xsl:for-each select="//comments">
<p class="comments"><h3><xsl:value-of select="title"/></h3></p>
<p class="comments"><xsl:value-of select="description"/></p>
<p class="comments">-- <xsl:value-of select="creator"/></p>
</xsl:for-each>
<hr/>
</xsl:element>
</xsl:for-each>
function displayResult()
{
var xml=loadXMLDoc("p100993_IR1.2_output_without_header_1.csv.xml");
var xsl=loadXMLDoc("LoadVendorAnalytic.xsl");
// code for IE
if (window.ActiveXObject)
{
var ex = xml.transformNode(xsl);
document.getElementById("entries").innerHTML = ex;
}
// code for Mozilla, Firefox, Opera, etc.
else if (document.implementation.createDocument)
{
var xsltProcessor = new XSLTProcessor();
xsltProcessor.importStylesheet(xsl);
var resultDocument = xsltProcessor.transformToFragment(xml,document);
document.getElementById("entries").appendChild(resultDocument);
}
}
function hideShow(id){
if(document.getElementById("comments"+id).style.display == 'none'){
document.getElementById("comments"+id).style.display = 'block';
document.getElementById("hideShowLink"+id).innerHTML = 'Hide Comments';
} else {
document.getElementById("comments"+id).style.display = 'none';
document.getElementById("hideShowLink"+id).innerHTML = 'Show Comments';
}
}
function hideShow(commentsId){
if(document.getElementById(commentsId).style.display == 'none'){
document.getElementById(commentsId).style.display = 'block';
document.getElementById("hideShowLink_" + commentsId).innerHTML = 'Hide Comments';
} else {
document.getElementById(commentsId).style.display = 'none';
document.getElementById("hideShowLink_" + commentsId).innerHTML = 'Show Comments';
}
}
<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html>
<body>
<div class="leftbody">
<!-- Loops Through all of the entries node in the XML and displays then in order by date descending order -->
<xsl:for-each select="//entries">
<xsl:sort select="creationTime/@sort" order="descending" />
<xsl:variable name="commentsId">comments_<xsl:value-of select="creationTime/@sort"/></xsl:variable>
<p><xsl:value-of select="creationTime"/>
[
<xsl:element name="a">
<xsl:attribute name="href">javascript:hideShow('<xsl:value-of select="$commentsId"/>')</xsl:attribute>
<xsl:value-of select="count(comments)"/> Comments
</xsl:element>
]
</p>
<h1><xsl:value-of select="title"/></h1>
<p><xsl:value-of select="description"/></p>
<br/>
<p>
<xsl:element name="a">
<xsl:attribute name="href">javascript:hideShow('<xsl:value-of select="$commentsId"/>')</xsl:attribute>
<xsl:attribute name="id">hideShowLink_<xsl:value-of select="$commentsId"/></xsl:attribute>
<xsl:attribute name="class">comments</xsl:attribute>
Hide Comments
</xsl:element>
</p>
<br/><hr/><br/>
<xsl:element name="div">
<xsl:attribute name="id"><xsl:value-of select="$commentsId"/></xsl:attribute>
<xsl:attribute name="class">comments</xsl:attribute>
<h2>Comments:</h2>
<xsl:for-each select="comments">
<p class="comments"><h3><xsl:value-of select="title"/></h3></p>
<p class="comments"><xsl:value-of select="description"/></p>
<p class="comments">-- <xsl:value-of select="creator"/></p>
</xsl:for-each>
<hr/>
</xsl:element>
</xsl:for-each>
</div>
</body>
</html>
</xsl:template>
</xsl:stylesheet>