JavaScript XMLDOM XML XSL Inte rnet проводник - я не могу отобразить преобразованный файл в браузере - PullRequest
0 голосов
/ 05 мая 2020

Я пытаюсь преобразовать файл XML с помощью XSL, используя JavaScript и XMLDOM с помощью MS Inte rnet Explorer, но я не могу заставить его работать. В инструменте разработчика на IE ошибок нет, но файл не отображается. У меня есть поисковые сайты вроде w3 c в течение нескольких часов, но я не могу найти ответ.

Это код, который я должен использовать:

<html>
<body>
    <script type=“text/javascript”>
        // Load the XML document
        var xml = new ActiveXObject(“Microsoft.XMLDOM”)
        xml.async = false
        xml.load(“myLibrary.xml”)
        // Load the XSL document
        var xsl = new ActiveXObject(“Microsoft.XMLDOM”)
        xsl.async = false
        xsl.load(“libraryStyle_v2.xsl”)
        //Do the transformation
        document.write(xml.transformNode(xsl))
    </script>
</body>
</html>

А вот код, который я использую:

<!DOCTYPE html>
<html>
<body>
    <script type=“text/javascript”>
        // Load the XML document
        var xml = new ActiveXObject(“Microsoft.XMLDOM”)
        xml.async = false
        xml.load(“travelDiaries.xml”)
        // Load the XSL document
        var xsl = new ActiveXObject(“Microsoft.XMLDOM”)
        xsl.async = false
        xsl.load(“travelDiaries.xsl”)
        //Do the transformation
        document.write(xml.transformNode(xsl))
    </script>
</body>
</html>

Я не уверен, что делаю неправильно. Я не должен использовать код, отличный от приведенного выше (за исключением некоторых небольших изменений)

вот мой XML код файла:

<?xml version="1.0" encoding="utf-8" ?>
<?xml-stylesheet href="travelDiaries.xsl" type="text/xsl"?>
<diaries>
    <diary name='Wojciech'>
          <entry date='2020/06/12' title='Poland'>
            <location>Poland</location>
            <description>Trip to see the, family and friends in a home town</description>
            <img></img>
         </entry>
    </diary>

    <diary name='Karolina'>
        <entry date='2018/04/12' title='Poland'>
            <location>Poland</location>
            <description>Trip for site visiting, visiting a Capital city of Poland - Warsaw </description>
            <img></img>
        </entry>
    </diary>

     <diary name='Kuba'>
          <entry date='2019/03/02' title='Czech republic'>
            <location>Czech republic</location>
            <description>Visiting the Old Praque with friends, seeing most popular sites</description>
            <img></img>
         </entry>
    </diary>

     <diary name='Kevin'>
          <entry date='2020/11/08' title='Usa'>
            <location>Usa</location>
            <description>Traveling around different states, meeting people and learning about the culture</description>
            <img></img>
         </entry>
    </diary>
</diaries>

и мой XSL-код:

<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
    <xsl:template match="/diaries">
        <html>
            <body>
                <table border="5">
                    <tr bgcolor="lawngreen">
                        <th>Date</th>
                        <th>Location</th>
                        <th>Description</th>
                        <th>Image</th>
                    </tr>
                <xsl:for-each select="diary/entry">
                 <xsl:sort select="@date" order="descending"/>
                        <tr>
                            <td>
                                <xsl:value-of select="@date"/>
                            </td>
                            <td>
                                <xsl:value-of select="location"/>
                            </td>
                            <td>
                                <xsl:value-of select="description"/>
                            </td>
                            <td>
                                <img border="1" width="100px" height="100px">
                                    <xsl:attribute name="src">
                                <xsl:value-of select="img"/>
                                    </xsl:attribute>
                                </img>
                            </td>
                        </tr>
                </xsl:for-each>
                </table>
            </body>
        </html>
    </xsl:template>
</xsl:stylesheet>

1 Ответ

0 голосов
/ 06 мая 2020

На основе содержимого вашего файла xml я изменил файл XML и файл XSLT, как показано ниже:

XML файл (измените расширение с .xsl на .xslt):

<?xml version="1.0" encoding="utf-8" ?>
<?xml-stylesheet href="travelDiaries.xslt" type="text/xsl"?>

файл travelDiaries.xslt:

<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
  <xsl:template match="/">
    <html>
      <body>
        <h2>Data collection</h2>
        <table border="1">
          <tr bgcolor="#9acd32">
            <th>Date</th>
            <th>Location</th>
            <th>Description</th>
          </tr>
          <xsl:for-each select="diaries/diary">
            <xsl:sort select="entry/@date" order="descending"/>
            <tr>
              <td>
                <xsl:value-of select="entry/@date"/>
              </td>
              <td>
                <xsl:value-of select="entry/location"/>
              </td>
              <td>
                <xsl:value-of select="entry/description"/>
              </td> 
            </tr>
          </xsl:for-each>
        </table>
      </body>
    </html>
  </xsl:template>
</xsl:stylesheet>

Затем на странице Html при использовании браузера IE мы могли бы использовать объект ActiveXObject и преобразование () для преобразования XML документа , при использовании браузера Edge или Chrome мы могли бы использовать XSLTProcessor объект для преобразования XML документа (проверьте XSLTProcessor Basi c Пример ). Проверьте следующий пример кода:

Html страница:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
    <div id="example">

    </div>
    <script>  
        var xml;
        var xsl;

        function loadXMLDoc(filename) {
            if (window.ActiveXObject || "ActiveXObject" in window) {
                xhttp = new ActiveXObject("Msxml2.XMLHTTP");
            } else {
                xhttp = new XMLHttpRequest();
            }
            xhttp.open("GET", filename, false);
            xhttp.send("");
            return xhttp.responseXML;
        }


        if (window.ActiveXObject || "ActiveXObject" in window) {
            ie();
        } else {

            xml = loadXMLDoc("XMLPage.xml");
            xsl = loadXMLDoc("travelDiaries.xslt");

            if (typeof XSLTProcessor !== 'undefined') {
                xsltProcessor = new XSLTProcessor();
                xsltProcessor.importStylesheet(xsl);
                resultDocument = xsltProcessor.transformToDocument(xml, document);

                var serializer = new XMLSerializer();
                var transformed = serializer.serializeToString(resultDocument.documentElement);

                //console.log(transformed);
                document.getElementById("example").innerHTML = transformed;
            }
        }

        // https://msdn.microsoft.com/en-us/library/ms753809(v=vs.85).aspx
        function ie() {

            var xslt = new ActiveXObject("Msxml2.XSLTemplate.3.0");
            var xslDoc = new ActiveXObject("Msxml2.FreeThreadedDOMDocument.3.0");
            var xslProc;
            xslDoc.async = false;
            xslDoc.load("travelDiaries.xslt");
            if (xslDoc.parseError.errorCode != 0) {
                var myErr = xslDoc.parseError;
                alert("You have error " + myErr.reason);
            } else {
                xslt.stylesheet = xslDoc;
                var xmlDoc = new ActiveXObject("Msxml2.DOMDocument.3.0");
                xmlDoc.async = false;
                xmlDoc.load("XMLPage.xml");
                if (xmlDoc.parseError.errorCode != 0) {
                    var myErr = xmlDoc.parseError;
                    alert("You have error " + myErr.reason);
                } else {
                    xslProc = xslt.createProcessor();
                    xslProc.input = xmlDoc;
                    xslProc.addParameter("param1", "Hello");
                    xslProc.transform();
                    //console.log(result);
                    var result = xslProc.output;       
                    if (result !== undefined) {
                        document.getElementById("example").innerHTML = result;
                    }
                }
            }
        }
    </script>
</body>
</html>

вывод IE 11:

enter image description here

...