在Microsft Edge和Internet Explorer瀏覽器中未加載XSLT和XML內容問題

我注意到，以下JavaScript代碼似乎沒有將任何XML或XSLT數據從其相應文件加載到Internet Explorer或Microsoft Edge瀏覽器，我不確定我寫錯了什麼。在Microsft Edge和Internet Explorer瀏覽器中未加載XSLT和XML內容問題

下面是兩個JavaScript函數，我使用加載內容..

function loadXMLDoc(filename) { 
    if (window.ActiveXObject) { 
     xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    else { 
     xhttp = new XMLHttpRequest(); 
    } 
    xhttp.open("GET", filename, false); 
    try { 
     xhttp.responseType = "msxml-document" 
    } catch (err) { 
    } // Helping IE11 
    xhttp.send(""); 
    return xhttp.responseXML; 
} 

function displayXMLDoc(xml_file, xsl_file, element_id) { 
    xml = loadXMLDoc(xml_file); 
    xsl = loadXMLDoc(xsl_file); 

    // BROWSER IS IE/EDGE. 
    if (window.ActiveXObject) { 
     ex = xml.transformNode(xsl); 
     document.getElementById(element_id).innerHTML = ex; 
    } 
    else if (document.implementation && document.implementation.createDocument) { 
     var xsltProcessor = new XSLTProcessor(); 
     xsltProcessor.importStylesheet(xsl); 
     var resultDocument = xsltProcessor.transformToFragment(xml, document); 
     document.getElementById(element_id).appendChild(resultDocument); 
    } 
}

這裏是如何將這些功能被稱爲...

<body onload="displayXMLDoc('myfile.xml', 'myfile.xsl', 'myoutput');">

請注意：

該代碼目前適用於所有其他瀏覽器，例如FireFox和Chrome。

來源

2016-08-14 TheAuzzieJesus

好，Edge支持'XSLTProcessor'，如果你想要編寫檢查的支持，接口/對象的代碼，那麼你應該的當然直接用例如'if（typeof XSLTProcessor！=='undefined'）{// now now XSLTProcessor here}'而不是像'document.implementation'那樣檢查不相關的東西，並且假設存在XSLT處理器。至於IE，你瞄準哪個版本的IE？當代碼失敗時，您是否在IE或Edge控制檯中收到任何錯誤消息？ –

'if（window.ActiveXObject）'作爲「BROWSER IS IE/EDGE」檢查是無稽之談，無論是IE 11還是Edge都不會給出該檢查的結果。 –

對於Chrome，Firefox和Edge，您可以使用http://plnkr.co/edit/Neqn90as6h9wUGg5qWNC?p=preview中使用的方法。 –

考慮到當前版本的Edge，Chrome和Firefox支持Promise最近的一種方法是使用庫在IE中支持Promise，這種方式使用promise來處理異步加載XML和XSLT文檔。這樣的代碼加載XML文檔，並和XSLT文檔，並應用XSLT轉換得到的HTML結果，設置一些XSLT參數的選項，如下所示：

function loadDoc(url) { 
     return new Promise(function(resolve) { 
     var req = new XMLHttpRequest(); 
     req.open("GET", url); 
     if (typeof XSLTProcessor === 'undefined') { 
      try { 
      req.responseType = 'msxml-document'; 
      } 
      catch (e) {} 
     } 
     req.onload = function() { 
      resolve(this.responseXML) 
     } 
     req.send(); 
     }); 
    } 

    function transform(xmlUrl, xslUrl, xsltParams, targetElement) { 
    Promise.all([loadDoc(xmlUrl), loadDoc(xslUrl)]).then(function(data) { 
     var xmlDoc = data[0]; 
     var xslDoc = data[1]; 

     if (typeof XSLTProcessor !== 'undefined') { 
     var proc = new XSLTProcessor(); 
     proc.importStylesheet(xslDoc); 

     for (var prop in xsltParams) { 
      proc.setParameter(null, prop, xsltParams[prop]); 
     } 

     var resultFrag = proc.transformToFragment(xmlDoc, targetElement.ownerDocument); 

     targetElement.textContent = ''; 
     targetElement.appendChild(resultFrag); 
     } 
     else { 
      var template = new ActiveXObject('Msxml2.XslTemplate.6.0'); 
      template.stylesheet = xslDoc; 
      var proc = template.createProcessor(); 

      for (var prop in xsltParams) { 
      proc.addParameter(prop, xsltParams[prop]); 
      } 

      proc.input = xmlDoc; 

      proc.transform(); 

      var resultHTML = proc.output; 

      targetElement.innerHTML = resultHTML; 
     } 
    }); 
    }

然後它可以被稱爲

transform('file.xml', 'input.xsl', { ids : 'test_value2'}, document.getElementById('d1'));

其中第三個參數是Javascript的任何參數的對象爲XSLT樣式表集，例如，如果該XSLT是

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> 

    <!-- pass in a string with a single id value for the parameters ids or a '|' separated list of ids --> 
    <xsl:param name="ids" select="''"/> 

    <xsl:output method="html" indent="yes"/> 

    <xsl:template match="/"> 

     <xsl:for-each select="products/test[$ids = '' or contains(concat('|', $ids, '|'), id)]"> 
      <a href="#"> Hello # <xsl:value-of select="value"/></a> 
     </xsl:for-each> 

    </xsl:template> 
</xsl:stylesheet>

那麼上述JA vascript snippets設置ids參數。

的XML輸入樣本是

<?xml version="1.0" encoding="UTF-8"?> 
<products> 

    <test> 
     <id>test_value1</id> 
     <value>1</value> 
    </test> 

    <test> 
     <id>test_value2</id> 
     <value>2</value> 
    </test> 

</products>

與IE瀏覽器，邊緣，Chrome和Firefox的當前版本的Windows 10的工作是在https://martin-honnen.github.io/xslt/arcor-archive/2016/test2016081501.html在線樣本。

一個工作代碼段是

 function loadDoc(url) { 
 
      return new Promise(function(resolve) { 
 
      var req = new XMLHttpRequest(); 
 
      req.open("GET", url); 
 
      if (typeof XSLTProcessor === 'undefined') { 
 
       try { 
 
       req.responseType = 'msxml-document'; 
 
       } 
 
       catch (e) {} 
 
      } 
 
      req.onload = function() { 
 
       resolve(this.responseXML) 
 
      } 
 
      req.send(); 
 
      }); 
 
     } 
 
     
 
     function transform(xmlUrl, xslUrl, xsltParams, targetElement) { 
 
     Promise.all([loadDoc(xmlUrl), loadDoc(xslUrl)]).then(function(data) { 
 
      var xmlDoc = data[0]; 
 
      var xslDoc = data[1]; 
 
      
 
      if (typeof XSLTProcessor !== 'undefined') { 
 
      var proc = new XSLTProcessor(); 
 
      proc.importStylesheet(xslDoc); 
 
      
 
      for (var prop in xsltParams) { 
 
       proc.setParameter(null, prop, xsltParams[prop]); 
 
      } 
 
      
 
      var resultFrag = proc.transformToFragment(xmlDoc, targetElement.ownerDocument); 
 
      
 
      targetElement.textContent = ''; 
 
      targetElement.appendChild(resultFrag); 
 
      } 
 
      else { 
 
       var template = new ActiveXObject('Msxml2.XslTemplate.6.0'); 
 
       template.stylesheet = xslDoc; 
 
       var proc = template.createProcessor(); 
 
       
 
       for (var prop in xsltParams) { 
 
       proc.addParameter(prop, xsltParams[prop]); 
 
       } 
 
       
 
       proc.input = xmlDoc; 
 
       
 
       proc.transform(); 
 
       
 
       var resultHTML = proc.output; 
 
       
 
       targetElement.innerHTML = resultHTML; 
 
      } 
 
     }); 
 
     } 
 
     
 
     document.addEventListener('DOMContentLoaded', function() { 
 
     transform('http://home.arcor.de/martin.honnen/cdtest/test2016081501.xml', 'http://home.arcor.de/martin.honnen/cdtest/test2016081501.xsl', { ids : 'test_value2'}, document.getElementById('d1')); 
 
     })

<script src="https://www.promisejs.org/polyfills/promise-7.0.4.min.js"></script> 
 

 
    <h1>Testing XSLT transformation</h1> 
 
    <div id="d1"></div>

來源

2016-08-15 14:11:05

在Microsft Edge和Internet Explorer瀏覽器中未加載XSLT和XML內容問題

回答

相關問題