XSLT 文档()在与 javascript xsltProcessor 一起使用时不起作用
XSLT document() not working whre used with javascript xsltProcessor
在浏览器中处理文档时这似乎工作正常
<select class="form-control">
<xsl:apply-templates select="document('Options.xml')/Options/Option"/>
</select>
但当我尝试使用 Javascript xsltProcessor 再次处理它时却没有。
有人知道吗?
Javascript:
let xsltProcessor = new XSLTProcessor();
const xmlResponseDocument = window.location.href;
const xmlContent = loadXMLDoc(xmlResponseDocument);
const path = '/Doc/Records';
const xslDocument = loadXMLDoc(pageTemplate);
xsltProcessor.importStylesheet(xslDocument);
const parser = new DOMParser();
target = '#main-content';
function xContent(e) {
var xml = xmlContent.documentElement;
var content = getElementByXpath(path);
xAttributesArray(e);
resultDocument = xsltProcessor.transformToFragment(content, document);
contentTarget = document.querySelector(target);
contentTarget.innerHTML = '';
contentTarget.appendChild(resultDocument);
}
function xAttributesArray(e) {
var attrArray = Array.from(e.attributes);
var i = 0;
qrStr = '';
attrArray.filter(attrArray => attrArray.name.startsWith('x-')).forEach(function (elm) {
var attname = elm.name.substring(2).replace(/(^\w|\s\w)/g, m => m.toUpperCase());
xsltProcessor.setParameter(null, attname, elm.value);
if (i > 0) { qrStr += '&'; }
qrStr += attname + '=' + elm.value.replace('#', '');
i++;
}
);
return attrArray;
}
function loadXMLDoc(filename) {
xhttp = new XMLHttpRequest();
xhttp.open("GET", filename, false);
xhttp.send("");
return xhttp.responseXML;
}
function getElementByXpath(path) {
try {
//let xmlContent = loadXMLDoc(xmlResponseDocument);
return document.evaluate(path, xmlContent, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
} catch (e) {
return e;
}
}
XML:
<?xml version="1.0" encoding="utf-8" ?>
<?xml-stylesheet type='text/xsl' href='/Test/Index.xslt'?>
<Doc>
<Records>
<Record ID="225">
<Room ID="2" Num="101" />
<Week>25</Week>
<Yr>2020</Yr>
<WeekIn>25</WeekIn>
<StayWeeks>1</StayWeeks>
<LastName>John</LastName>
<FirstName>Doe</FirstName>
</Record>
<Record ID="226">
<Room ID="2" Num="101" />
<Week>26</Week>
<Yr>2020</Yr>
<WeekIn>26</WeekIn>
<StayWeeks>1</StayWeeks>
<LastName>Jane</LastName>
<FirstName>Doe</FirstName>
<Color>magenta</Color>
</Record>
<Record ID="227">
<Room ID="2" Num="101" />
<Week>27</Week>
<Yr>2020</Yr>
<StayWeeks>0</StayWeeks>
</Record>
<Record ID="228">
<Room ID="2" Num="101" />
<Week>28</Week>
<Yr>2020</Yr>
<WeekIn>28</WeekIn>
<StayWeeks>2</StayWeeks>
<LastName>David</LastName>
<FirstName>Davies</FirstName>
<Color>magenta</Color>
</Record>
<Record ID="230">
<Room ID="2" Num="101" />
<Week>30</Week>
<Yr>2020</Yr>
<WeekIn>30</WeekIn>
<StayWeeks>1</StayWeeks>
<LastName>Marcus</LastName>
<FirstName>Marco</FirstName>
<Color>magenta</Color>
</Record>
<Record ID="233">
<Room ID="2" Num="101" />
<Week>33</Week>
<Yr>2020</Yr>
<StayWeeks>0</StayWeeks>
</Record>
<Record ID="234">
<Room ID="2" Num="101" />
<Week>34</Week>
<Yr>2020</Yr>
<StayWeeks>0</StayWeeks>
</Record>
<Record ID="325">
<Room ID="3" Num="102" />
<Week>25</Week>
<Yr>2020</Yr>
<StayWeeks>0</StayWeeks>
</Record>
</Records>
</Doc>
XSLT:
<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns:msxsl="urn:schemas-microsoft-com:xslt" exclude-result-prefixes="msxsl"
>
<xsl:output method="html" indent="yes"/>
<xsl:param name="Id"/>
<xsl:param name="View"/>
<xsl:template match="Doc">
<html>
<head></head>
<body>
<div id="main-content">
<xsl:apply-templates select="Records"/>
</div>
<script type="text/javascript">let pageTemplate = '/Test/Index.xslt'</script>
<script type="text/javascript" charset="utf8" src="/Test/test.js"></script>
</body>
</html>
</xsl:template>
<xsl:template match="Records">
<xsl:choose>
<xsl:when test="$View='form'">
<xsl:apply-templates select="Record[@ID=$Id]" mode="form"/>
</xsl:when>
<xsl:otherwise>
<select class="form-control">
<xsl:apply-templates select="document('Options.xml')/Options/Option"/>
</select>
<table>
<thead>
<tr>
<th>Room</th>
<th>Week</th>
<th>Last Name</th>
<th>First Name</th>
</tr>
</thead>
<tbody>
<xsl:apply-templates select="Record"/>
</tbody>
</table>
</xsl:otherwise>
</xsl:choose>
</xsl:template>
<xsl:template match="Record">
<tr onclick="xContent(this)" x-id="{@ID}" x-view="form">
<td>
<xsl:value-of select="Room/@Num"/>
</td>
<td>
<xsl:value-of select="Week"/>
</td>
<td>
<xsl:value-of select="LastName"/>
</td>
<td>
<xsl:value-of select="FirstName"/>
</td>
</tr>
</xsl:template>
<xsl:template match="Record" mode="form">
<div>
<input value="{Room/@Num}"></input>
<input value="{LastName}"></input>
<input value="{FirstName}"></input>
<select class="form-control">
<xsl:apply-templates select="document('Options.xml')/Options/Option"/>
</select>
</div>
</xsl:template>
<xsl:template match="Option">
<option>
<xsl:value-of select="Name"/>
</option>
</xsl:template>
</xsl:stylesheet>
我认为这是 Chromium https://bugs.chromium.org/p/chromium/issues/detail?id=8441 and WebKit https://bugs.webkit.org/show_bug.cgi?id=60276 中一个长期存在的已知错误,他们不打算修复。
在浏览器中处理文档时这似乎工作正常
<select class="form-control">
<xsl:apply-templates select="document('Options.xml')/Options/Option"/>
</select>
但当我尝试使用 Javascript xsltProcessor 再次处理它时却没有。
有人知道吗?
Javascript:
let xsltProcessor = new XSLTProcessor();
const xmlResponseDocument = window.location.href;
const xmlContent = loadXMLDoc(xmlResponseDocument);
const path = '/Doc/Records';
const xslDocument = loadXMLDoc(pageTemplate);
xsltProcessor.importStylesheet(xslDocument);
const parser = new DOMParser();
target = '#main-content';
function xContent(e) {
var xml = xmlContent.documentElement;
var content = getElementByXpath(path);
xAttributesArray(e);
resultDocument = xsltProcessor.transformToFragment(content, document);
contentTarget = document.querySelector(target);
contentTarget.innerHTML = '';
contentTarget.appendChild(resultDocument);
}
function xAttributesArray(e) {
var attrArray = Array.from(e.attributes);
var i = 0;
qrStr = '';
attrArray.filter(attrArray => attrArray.name.startsWith('x-')).forEach(function (elm) {
var attname = elm.name.substring(2).replace(/(^\w|\s\w)/g, m => m.toUpperCase());
xsltProcessor.setParameter(null, attname, elm.value);
if (i > 0) { qrStr += '&'; }
qrStr += attname + '=' + elm.value.replace('#', '');
i++;
}
);
return attrArray;
}
function loadXMLDoc(filename) {
xhttp = new XMLHttpRequest();
xhttp.open("GET", filename, false);
xhttp.send("");
return xhttp.responseXML;
}
function getElementByXpath(path) {
try {
//let xmlContent = loadXMLDoc(xmlResponseDocument);
return document.evaluate(path, xmlContent, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
} catch (e) {
return e;
}
}
XML:
<?xml version="1.0" encoding="utf-8" ?>
<?xml-stylesheet type='text/xsl' href='/Test/Index.xslt'?>
<Doc>
<Records>
<Record ID="225">
<Room ID="2" Num="101" />
<Week>25</Week>
<Yr>2020</Yr>
<WeekIn>25</WeekIn>
<StayWeeks>1</StayWeeks>
<LastName>John</LastName>
<FirstName>Doe</FirstName>
</Record>
<Record ID="226">
<Room ID="2" Num="101" />
<Week>26</Week>
<Yr>2020</Yr>
<WeekIn>26</WeekIn>
<StayWeeks>1</StayWeeks>
<LastName>Jane</LastName>
<FirstName>Doe</FirstName>
<Color>magenta</Color>
</Record>
<Record ID="227">
<Room ID="2" Num="101" />
<Week>27</Week>
<Yr>2020</Yr>
<StayWeeks>0</StayWeeks>
</Record>
<Record ID="228">
<Room ID="2" Num="101" />
<Week>28</Week>
<Yr>2020</Yr>
<WeekIn>28</WeekIn>
<StayWeeks>2</StayWeeks>
<LastName>David</LastName>
<FirstName>Davies</FirstName>
<Color>magenta</Color>
</Record>
<Record ID="230">
<Room ID="2" Num="101" />
<Week>30</Week>
<Yr>2020</Yr>
<WeekIn>30</WeekIn>
<StayWeeks>1</StayWeeks>
<LastName>Marcus</LastName>
<FirstName>Marco</FirstName>
<Color>magenta</Color>
</Record>
<Record ID="233">
<Room ID="2" Num="101" />
<Week>33</Week>
<Yr>2020</Yr>
<StayWeeks>0</StayWeeks>
</Record>
<Record ID="234">
<Room ID="2" Num="101" />
<Week>34</Week>
<Yr>2020</Yr>
<StayWeeks>0</StayWeeks>
</Record>
<Record ID="325">
<Room ID="3" Num="102" />
<Week>25</Week>
<Yr>2020</Yr>
<StayWeeks>0</StayWeeks>
</Record>
</Records>
</Doc>
XSLT:
<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns:msxsl="urn:schemas-microsoft-com:xslt" exclude-result-prefixes="msxsl"
>
<xsl:output method="html" indent="yes"/>
<xsl:param name="Id"/>
<xsl:param name="View"/>
<xsl:template match="Doc">
<html>
<head></head>
<body>
<div id="main-content">
<xsl:apply-templates select="Records"/>
</div>
<script type="text/javascript">let pageTemplate = '/Test/Index.xslt'</script>
<script type="text/javascript" charset="utf8" src="/Test/test.js"></script>
</body>
</html>
</xsl:template>
<xsl:template match="Records">
<xsl:choose>
<xsl:when test="$View='form'">
<xsl:apply-templates select="Record[@ID=$Id]" mode="form"/>
</xsl:when>
<xsl:otherwise>
<select class="form-control">
<xsl:apply-templates select="document('Options.xml')/Options/Option"/>
</select>
<table>
<thead>
<tr>
<th>Room</th>
<th>Week</th>
<th>Last Name</th>
<th>First Name</th>
</tr>
</thead>
<tbody>
<xsl:apply-templates select="Record"/>
</tbody>
</table>
</xsl:otherwise>
</xsl:choose>
</xsl:template>
<xsl:template match="Record">
<tr onclick="xContent(this)" x-id="{@ID}" x-view="form">
<td>
<xsl:value-of select="Room/@Num"/>
</td>
<td>
<xsl:value-of select="Week"/>
</td>
<td>
<xsl:value-of select="LastName"/>
</td>
<td>
<xsl:value-of select="FirstName"/>
</td>
</tr>
</xsl:template>
<xsl:template match="Record" mode="form">
<div>
<input value="{Room/@Num}"></input>
<input value="{LastName}"></input>
<input value="{FirstName}"></input>
<select class="form-control">
<xsl:apply-templates select="document('Options.xml')/Options/Option"/>
</select>
</div>
</xsl:template>
<xsl:template match="Option">
<option>
<xsl:value-of select="Name"/>
</option>
</xsl:template>
</xsl:stylesheet>
我认为这是 Chromium https://bugs.chromium.org/p/chromium/issues/detail?id=8441 and WebKit https://bugs.webkit.org/show_bug.cgi?id=60276 中一个长期存在的已知错误,他们不打算修复。