如何使用javascript将xsl样式应用于html中的嵌入式xml

how to apply xsl styles to an embedded xml inside html with javascript

本文关键字：html 嵌入式 xml 应用于 样式 何使用 javascript xsl      更新时间：2023-11-29

我有一个嵌入xml标记的html文件，在这里我试图应用xslt样式。xslt样式是在另一个单独的文件（somefile.xsl）中用javascript导入的，我成功地用javascript导入外部xslt文件来应用样式，但它只在internet explorer中工作，其他浏览器无法应用样式。。下面是我的html代码，请看我的代码。我哪里做错了？除了IE，似乎没有其他浏览器使用这些技术。

    <HTML>
    <HEAD>
    <TITLE>Sample XML with XSL</TITLE>
        <xml id="elx">
            <hello-world>  
            <greeter>An XSLT Programmer</greeter>   
            <greeting>Hello, World! </greeting>
           </hello-world>
       </xml>
   </HEAD>
   <BODY>
   <SCRIPT language = "javascript">
   if(window.ActiveXObject)
   {
    //IE
         alert("hi");
         var xslDoc = new ActiveXObject("Microsoft.XMLDOM");
         xslDoc.async = false;
         xslDoc.load("helloworld.xsl");
         document.write(elx.transformNode(xslDoc));
 }
 else if (document.implementation && document.implementation.createDocument)
{
  //For Other Browsers
          xsltProcessor=new XSLTProcessor();
          xsltProcessor.importStylesheet("helloworld.xsl");
          result = xsltProcessor.transformToDocument(elx);
          // here 'elx' is id of embedded xml in header.
          document.write(result);
 }
  </SCRIPT>
  </BODY>
  </HTML>

这是我的xsl（helloworld.xsl）文件，我正试图用javascript导入它，并在html文件中为嵌入的xml添加样式

<?xml version="1.0" encoding="ISO-8859-1" ?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0" >
<xsl:output method="html" version="1.1" encoding="iso-8859-1" />
<xsl:template match="/hello-world">
    <HTML>
        <HEAD>
            <TITLE>
            </TITLE>
        </HEAD>
        <BODY>
            <H1>
                <xsl:value-of select="greeting"/>
            </H1>
            <xsl:apply-templates select="greeter"/>
        </BODY>
    </HTML>
</xsl:template>

在我的html文件中，我只获得该xml文件的id，通过使用该xml id，我需要使用javascript应用样式。希望你能理解我的问题，并尽快解决这个问题。

importStylesheet需要对象（而不是文件的url），您可以从domParser 获得它

var domParser = new DOMParser();
xsltProcessor.importStylesheet( domParser.parseFromString(some_text_value, "text/xml") );

完整的懒惰解决方案，适用于Firefox/类似合唱的以下代码

<HTML>
<HEAD>
<script id="elx" type="text/xml">
    <hello-world>  
        <greeter>An XSLT Programmer</greeter>   
        <greeting>Hello, World! </greeting>
   </hello-world>
</script>
<script id="stlsh" type="text/xml">
    <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
    <xsl:output method="html" version="1.1" encoding="iso-8859-1" />
    <xsl:template match="/hello-world">
        <HTML>
            <BODY>
                <H1>
                    <xsl:value-of select="greeting"/>
                </H1>
                <xsl:apply-templates select="greeter"/>
            </BODY>
        </HTML>
    </xsl:template>
    </xsl:stylesheet>
</script>
</HEAD>
<BODY>
<SCRIPT language = "javascript">
    var domParser = new DOMParser();
    var xsltProcessor = new XSLTProcessor();
    xsltProcessor.importStylesheet( domParser.parseFromString(stlsh.innerHTML, "text/xml") );
    var result = xsltProcessor.transformToDocument( domParser.parseFromString(elx.innerHTML, "text/xml") );
    document.write(result.firstElementChild.innerHTML);
</SCRIPT>
</BODY>
</HTML>

如果您想要使用外部文件，您需要将stlsh.innerHTML/elx.innerHTML更改为带有responseText的XMLHttpRequest，并将其放入domParser。

或者获取XMLHttpRequest响应XML.dococumentElement-可能是，domParser不需要

当然，XSL教程是W3Schools:

http://www.w3schools.com/xsl/xsl_transformation.asp

但在你的原因中，我认为围绕你的"其他浏览器"的if语句是可疑的问题。

<yourCode>
else if (document.implementation && document.implementation.createDocument)
</yourCode>

你能在If语句中添加一个警报或控制台日志进行检查吗？为什么你还有第二个if语句呢？如果你有"IE代码"answers"非IE"代码，为什么不把它放在其他代码中呢？

注意：还没有尝试过你的代码，它是感恩节之夜，我有点累，但只有一些想法

相关文章：