如何使用JavaScript将xsl样式应用于html内的嵌入式xml

Question

I have a html file embedded xml tags inside, here i am trying to apply xslt styles are written in another separate file (somefile.xsl) importing with javascript, i am successful applying styles with external xslt file importing with javascript but it is working only in internet explorer , other browsers failed to apply styles.. bellow is my html code please look at my code. 我在其中嵌入了html文件的html文件，在这里我尝试将xslt样式写在另一个使用javascript导入的单独文件（somefile.xsl）中，我成功地将样式与外部javascript导入的xslt文件一起使用，但它仅能正常工作在Internet Explorer中，其他浏览器无法应用样式。下面是我的html代码，请查看我的代码。 where i am doing wrong here ? 我在哪里做错了？ Except IE no other browser seem working with these technique. 除了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>

and here is my xsl ( helloworld.xsl ) file which i am trying to import with javascript and adding styles to embedded xml inside html file 这是我的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>

within my html file i get only id of that xml file, by using that xml id i need to apply styles using javascript. 在我的html文件中，我仅获得该xml文件的ID，通过使用该xml ID，我需要使用javascript应用样式。 hope you understand my issue and please solve this as soon as possible. 希望您了解我的问题，请尽快解决。

Answer 1

importStylesheet needs object(not url to file), you can get it from domParser importStylesheet需要对象（不是指向文件的url），您可以从domParser中获取它

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

Full lazy solution for Firefox/Chorme like following code Firefox / Chorme的完整懒惰解决方案，例如以下代码

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

If you will want use external files, you need to change stlsh.innerHTML/elx.innerHTML to XMLHttpRequest with responseText and put it to domParser. 如果要使用外部文件，则需要使用带有responseText的stlsh.innerHTML / elx.innerHTML更改为XMLHttpRequest并将其放入domParser。

Or get XMLHttpRequest responseXML.documentElement - may be, domParser doesn't need 或者获取XMLHttpRequest responseXML.documentElement-可能是domParser不需要

Answer 2

well for sure the go to XSL tutorial is W3Schools: 可以肯定的是，转到XSL教程的是W3Schools：

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

but in your cause I think the if-statement around your "other browser" is the issue that is suspect. 但是出于您的原因，我认为您“其他浏览器”周围的if语句是可疑的问题。

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

can you add an alert or a console log into that If statement to check? 您可以在该If语句中添加警报或控制台日志以进行检查吗？ also why do you have a second if statement at all? 还为什么还要有第二个if语句？ if you have "IE code" and "non IE" code why not just put it in an else? 如果您有“ IE代码”和“非IE”代码，为什么不将其放在其他代码中呢？

NOTE: have not tried your code, its thanksgiving night and im a bit tired but just a few thoughts 注意：还没有尝试过您的代码，它的感恩节之夜和我有点累，但只是一些想法

如何使用JavaScript将xsl样式应用于html内的嵌入式xml

问题描述

2 个解决方案

解决方案1
1 2015-05-07 13:26:47

解决方案2
0 2013-11-29 03:24:24

如何使用JavaScript将xsl样式应用于html内的嵌入式xml

问题描述

2 个解决方案

解决方案1 1 2015-05-07 13:26:47

解决方案2 0 2013-11-29 03:24:24

解决方案1
1 2015-05-07 13:26:47

解决方案2
0 2013-11-29 03:24:24