gpt4 book ai didi

javascript - 使用 JavaScript 修改加载的 XML(通过 XSL 在浏览器(Chrome)中显示)

转载 作者:行者123 更新时间:2023-11-30 05:43:16 25 4
gpt4 key购买 nike

我在 Chrome 浏览器控件 (CefSharp.Wpf) 中显示了以下 XML 文档:

<?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 吗?即使我删除了一个节点,浏览器也没有更新他的 View 。

我不想在添加新条目时重新加载整个文档(大约需要 80 毫秒)。我不想在浏览器中直接编写 HTML,因为 xsl-template 部分存储为模板并且可以更改。

欢迎任何其他想法! :)

提前致谢!

最佳答案

在现代浏览器中,您可以从 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>

关于javascript - 使用 JavaScript 修改加载的 XML(通过 XSL 在浏览器(Chrome)中显示),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19539901/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com