Javascript 使用XSLT和CSS加载/转换XML
完全是新手。提前谢谢。下面是： 我尝试使用XSL样式表转换XML文档，XSL样式表链接到CSS文件。当我在浏览器（Chrome）中从我的计算机打开XML文件时，数据会正确地显示在XSL和CSS文件之后。XSL样式表中还有javascript数学函数，用于从XML文件中获取一个元素，并将其乘以不同的百分比。这个数学也适用 但是，当我尝试使用Javascript（如下）在HTML中加载/转换XML文档时，XSL样式成功了，但CSS关闭了。在Chrome中，CSS显示的页面布局。但是字体太小，背景图像不显示。无论我在CSS中做了什么更改，字体都很难阅读，因为它太小了。在IE中，CSS根本不会出现 另外，Javascript似乎隐藏了xml数据，我想这对SEO是有害的 有人有什么建议/不同的方法吗？我不能使用ASP，因为我的Web服务器不允许使用它，但其他任何东西都不允许 以下是我的html文档中的脚本：Javascript 使用XSLT和CSS加载/转换XML,javascript,css,xml,xslt,Javascript,Css,Xml,Xslt,完全是新手。提前谢谢。下面是： 我尝试使用XSL样式表转换XML文档，XSL样式表链接到CSS文件。当我在浏览器（Chrome）中从我的计算机打开XML文件时，数据会正确地显示在XSL和CSS文件之后。XSL样式表中还有javascript数学函数，用于从XML文件中获取一个元素，并将其乘以不同的百分比。这个数学也适用 但是，当我尝试使用Javascript（如下）在HTML中加载/转换XML文档时，XSL样式成功了，但CSS关闭了。在Chrome中，CSS显示的页面布局。但是字体太小，背景图像
<html>
<head>
<script>
function loadXMLDoc(dname) {
if (window.XMLHttpRequest) {
xhttp = new XMLHttpRequest();
} else {
xhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xhttp.open("GET",dname,false);
xhttp.send("");
return xhttp.responseXML;
}
function displayResult() {
xml = loadXMLDoc("WORKS.xml");
xsl = loadXMLDoc("WORKS.xsl");
// code for IE
if (window.ActiveXObject) {
ex = xml.transformNode(xsl);
document.getElementById("example").innerHTML = ex;
}
// code for Mozilla, Firefox, Opera,etc.
else if (document.implementation &&
document.implementation.createDocument) {
xsltProcessor=new XSLTProcessor();
xsltProcessor.importStylesheet(xsl);
resultDocument = xsltProcessor.transformToFragment(xml,document);
document.getElementById("example").appendChild(resultDocument);
}
}
</script>
</head>
<body onload="displayResult()">
<div id="example" />
</body>
</html>
函数loadXMLDoc（dname）{
if（window.XMLHttpRequest）{
xhttp=newXMLHttpRequest（）；
}否则{
xhttp=新的ActiveXObject（“Microsoft.XMLHTTP”）；
}
xhttp.open（“GET”、dname、false）；
xhttp.send（“”）；
返回xhttp.responseXML；
}
函数displayResult（）{
xml=loadXMLDoc（“WORKS.xml”）；
xsl=loadXMLDoc（“WORKS.xsl”）；
//IE代码
if（window.ActiveXObject）{
ex=xml.transformNode（xsl）；
document.getElementById（“示例”）.innerHTML=ex；
}
//Mozilla、Firefox、Opera等的代码。
else if（文件、实施和
document.implementation.createDocument）{
xsltProcessor=新的xsltProcessor（）；
导入样式表（xsl）；
resultDocument=xsltProcessor.transformToFragment（xml，文档）；
document.getElementById（“示例”）.appendChild（resultDocument）；
}
}
Alan这实际上取决于works.xml和works.xsl的内容。建议：将结果文档吐到文本区域，看看html是否正常。在这一点上，您还可以save=>在Chrome/IE中加载html结果文档，并确保其外观良好 一旦您知道html中的什么导致了问题，那么就更容易找到原因并修复它 您可以通过添加以下内容查看输出html：
<textarea cols="255" rows="50" id="textarea1"></textarea>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<!--<html>
<head>-->
<link rel="stylesheet" href="galleryCSS.css" type="text/css" />
<!--</head>
<body>-->
<h2>Choosy Child Guaranteed BuyBack System</h2>
<ul class="gallery">
<xsl:for-each select="WORKS/item">
<li>
<a href="picture1.jpg">
<img src="picture1.jpg" alt="image" />
</a>
<em>
<xsl:value-of select="name"/>
</em>
<br />
Buy Price: <em>
$<xsl:value-of select="price"/>
</em>
<br />
1-4 Day BuyBack: <em>
$<script type="text/javascript">
x=<xsl:value-of select="price"/>*.15; document.write(Math.round(x*100)/100);
</script>
</em>
<br />
5-7 Day BuyBack: <em>
$<script type="text/javascript">
x=<xsl:value-of select="price"/>*.25; document.write(Math.round(x*100)/100);
</script>
</em>
<br />
8-14 Day BuyBack: <em>
$<script type="text/javascript">
x=<xsl:value-of select="price"/>*.40; document.write(Math.round(x*100)/100);
</script>
</em>
<br />
15-30 Day BuyBack: <em>
$<script type="text/javascript">
x=<xsl:value-of select="price"/>*.60; document.write(Math.round(x*100)/100);
</script>
</em>
<br />
30+ Day Buyback: <em>
$<script type="text/javascript">
x=<xsl:value-of select="price"/>*.75; document.write(Math.round(x*100)/100);
</script>
</em>
</li>
</xsl:for-each>
</ul>
<!--
</body>
</html>-->
</xsl:template>
</xsl:stylesheet>
有选择的儿童担保回购制度
-
购买价格：
$
1-4天回购：
$
x=*.15；写文件（数学四舍五入（x*100）/100）；
5-7天回购：
$
x=*.25；写文件（数学四舍五入（x*100）/100）；
8-14天回购：
$
x=*.40；写文件（数学四舍五入（x*100）/100）；
15-30天回购：
$
x=*.60；写文件（数学四舍五入（x*100）/100）；
30天以上回购：
$
x=*.75；写文件（数学四舍五入（x*100）/100）；
还有其他方法可以缩短和简化代码，并且不重复脚本标记，但这超出了本问题的范围 这实际上取决于works.xml和works.xsl的内容。建议：将结果文档吐到文本区域，看看html是否正常。在这一点上，您还可以save=>在Chrome/IE中加载html结果文档，并确保其外观良好 一旦您知道html中的什么导致了问题，那么就更容易找到原因并修复它 您可以通过添加以下内容查看输出html：
<textarea cols="255" rows="50" id="textarea1"></textarea>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<!--<html>
<head>-->
<link rel="stylesheet" href="galleryCSS.css" type="text/css" />
<!--</head>
<body>-->
<h2>Choosy Child Guaranteed BuyBack System</h2>
<ul class="gallery">
<xsl:for-each select="WORKS/item">
<li>
<a href="picture1.jpg">
<img src="picture1.jpg" alt="image" />
</a>
<em>
<xsl:value-of select="name"/>
</em>
<br />
Buy Price: <em>
$<xsl:value-of select="price"/>
</em>
<br />
1-4 Day BuyBack: <em>
$<script type="text/javascript">
x=<xsl:value-of select="price"/>*.15; document.write(Math.round(x*100)/100);
</script>
</em>
<br />
5-7 Day BuyBack: <em>
$<script type="text/javascript">
x=<xsl:value-of select="price"/>*.25; document.write(Math.round(x*100)/100);
</script>
</em>
<br />
8-14 Day BuyBack: <em>
$<script type="text/javascript">
x=<xsl:value-of select="price"/>*.40; document.write(Math.round(x*100)/100);
</script>
</em>
<br />
15-30 Day BuyBack: <em>
$<script type="text/javascript">
x=<xsl:value-of select="price"/>*.60; document.write(Math.round(x*100)/100);
</script>
</em>
<br />
30+ Day Buyback: <em>
$<script type="text/javascript">
x=<xsl:value-of select="price"/>*.75; document.write(Math.round(x*100)/100);
</script>
</em>
</li>
</xsl:for-each>
</ul>
<!--
</body>
</html>-->
</xsl:template>
</xsl:stylesheet>
有选择的儿童担保回购制度
-
购买价格：
$
1-4天回购：
$
x=*.15；写文件（数学四舍五入（x*100）/100）；
5-7天回购：
$
x=*.25；写文件（数学四舍五入（x*100）/100）；
8-14天回购：
$
x=*.40；写文件（数学四舍五入（x*100）/100）；
15-30天回购：
$
x=*.60；写文件（数学四舍五入（x*100）/100）；
30天以上回购：
$
x=*.75；写文件（数学四舍五入（x*100）/100）；