修改加載XML的JavaScript

（在瀏覽器（Chrome）通過XSL顯示）

我已經在Chrome瀏覽器控件中顯示下面的XML文檔（CefSharp.Wpf）：修改加載XML的JavaScript

<?xml-stylesheet type="text/xsl" href="#"?> 
<xsl:stylesheet version="1.0" xmlns:data="x" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> 
<data:data> 
    <log> 
    <entry> 
    <message>first</message> 
    </entry> 
    <entry> 
    <message>second</message> 
    </entry> 
    </log> 
</data:data> 
<xsl:template match="xsl:stylesheet"> 
    <xsl:apply-templates select="data:data" /> 
</xsl:template> 
<xsl:template match="log"> 
    <html> 
    <body> 
    <xsl:for-each select="entry"> 
     <xsl:value-of select="message" /><br /> 
    </xsl:for-each> 
</body> 
    </html> 
</xsl:template> 
</xsl:stylesheet>

現在我想添加一個新的<entry>通過JavaScript（活動日誌窗口）。是否有可能改變XML'現場'？即使我刪除了一個節點，瀏覽器也沒有更新他的視圖。

我不想在添加新條目時重新加載整個文檔（大約需要80ms）。我不想在瀏覽器中編寫直接的HTML，因爲xsl-template部分存儲爲模板並可以更改。

歡迎任何其他想法！ :)

在此先感謝！

來源

2013-10-23 ayhjar

在現代瀏覽器中，您可以重新運行Javascript的轉換。只需要訪問原始的XML文件。

參見下面的示例HTML：

<!DOCTYPE html> 
<html> 
<head> 
<script> 

function sjax(url) { 
    var req = new XMLHttpRequest(); 
    req.open("GET",url,false); 
    req.send(null); 
    return req.responseXML; 
} 

function transformBody(data, template) { 

    while ((e = document.body.firstChild) !== null) { 
     document.body.removeChild(e); 
    } 

    var processor = new XSLTProcessor(); 
    processor.importStylesheet(template); 
    var resultFragment = processor.transformToFragment(data, document); 
    document.body.appendChild(resultFragment); 
} 

var data = sjax("data.xml"); 
var xslt = sjax("template.xslt"); 

window.addEventListener("load", function (e) { 
    transformBody(data, xslt); 
}, false); 

window.addEventListener("click", function (e) { 
    data.documentElement.querySelector("log") 
     .appendChild(data.createElement("entry")) 
     .appendChild(data.createElement("message")) 
     .appendChild(data.createTextNode("new node")); 
    transformBody(data, xslt); 
}, false); 
</script> 
</head> 
<body> 
</body> 
</html>

data.xml中

<?xml version="1.0" encoding="UTF-8"?> 
<data:data xmlns:data="x"> 
    <log> 
    <entry> 
    <message>first</message> 
    </entry> 
    <entry> 
    <message>second</message> 
    </entry> 
    </log> 
</data:data>

template.xslt

<?xml version="1.0" encoding="UTF-8"?> 
<xsl:stylesheet version="1.0" xmlns:data="x" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> 
<xsl:template match="xsl:stylesheet"> 
    <xsl:apply-templates select="data:data" /> 
</xsl:template> 
<xsl:template match="log"> 
    <html> 
    <body> 
    <xsl:for-each select="entry"> 
    <xsl:value-of select="message" /><br /> 
    </xsl:for-each> 
</body> 
    </html> 
</xsl:template> 
</xsl:stylesheet>

來源

2013-12-16 14:48:01 vbence

修改加載XML的JavaScript

回答

相關問題