How can one match a subnode in xslt in xml? - html

Question

I've inherited a project that wants to use xslt to transform some html. Matching works with '/', but I can't get it to run on a subnode
I've found some code snippet on mozilla, that applies xslt transformation to html on mozilla, the code works https://developer.mozilla.org/en-US/docs/Web/XSLT/XSLT_JS_interface_in_Gecko/Advanced_Example.
The Problem is that I'm not able to template match the node "firmenliste"
What I use is:
var xslRef;
var xslloaded = false;
var xsltProcessor = new XSLTProcessor();
var myDOM;
var xmlRef = document.implementation.createDocument("", "", null);
p = new XMLHttpRequest();
p.open("GET", "xsl/FirmenListe.xsl",false);
p.send(null);
xslRef = p.responseXML;
xsltProcessor.importStylesheet(xslRef);
xmlRef = document.implementation.createDocument("", "", null);
// we want to move a part of the DOM from an HTML document to an XML document.
// importNode is used to clone the nodes we want to process via XSLT - true makes it do a deep clone
var myNode = document.getElementById("example");
var clonedNode = xmlRef.importNode(myNode, true);
// after cloning, we append
xmlRef.appendChild(clonedNode);
var fragment = xsltProcessor.transformToFragment(xmlRef, document);
// clear the contents
document.getElementById("example").innerHTML = "";
myDOM = fragment;
// add the new content from the transformation
document.getElementById("example").appendChild(fragment)
The corresponding html and xslt looks like:
<xml id="Data">
<data id="example" xmlns:dt="urn:schemas-microsoft-com:datatypes">
<firmenliste></firmenliste>
</data>
</xml>
<?xml version ='1.0'?>
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
>
<xsl:template match="/">
b
<xsl:apply-templates select="firmenliste"/>
</xsl:template>
<xsl:template match="firmenliste">
A
</xsl:template>
</xsl:stylesheet>
The output should be
<xml id="Data">
<data id="example" xmlns:dt="urn:schemas-microsoft-com:datatypes">
bA
</data>
</xml>
But what i get is
<xml id="Data">
<data id="example" xmlns:dt="urn:schemas-microsoft-com:datatypes">
b
</data>
</xml>
Edit: The problem is reproducible in https://next.plnkr.co/edit/Yvc59BPQmI1PHlSy?open=lib%2Fscript.js&preview

Answer 1

I think the main problem is that you start with elements in a HTML DOM document which since HTML5 are by definition in the XHTML namespace http://www.w3.org/1999/xhtml and then clone and copy them to an XML document where they keep their namespace but where in XSLT/XPath a path or match pattern like firmenliste selects or matches elements of that name in no namespace and not in the XHTML namespace.
So using
<xsl:template match="/">
b
<xsl:apply-templates/>
</xsl:template>
<xsl:template match="xhtml:firmenliste" xmlns:xhtml="http://www.w3.org/1999/xhtml">
A
</xsl:template>
instead would fix that problem: https://next.plnkr.co/edit/tsB9qwCafLodg8Rz?open=lib%2Fscript.js&preview
But the whole approach of using non-defined elements like xml or firmenliste in HTML and moving between HTML DOM and XML DOMs is asking for trouble in my experience. Consider to keep the XML data you want to transform outside of the HTML document in a separate XML document, only use XSLT on XML documents and only use its transformation result to be inserted into an HTML DOM if you have used transformToFragment with the owning HTML document as the second argument.

Answer 2

In your xslt, while matching root node with '/', You need to give whole xPath to match <firmenliste> in <xsl:apply-templates>
Try the same by replacing the line <xsl:apply-templates select="firmenliste"/>
with <xsl:apply-templates select="/xml/data/firmenliste"/>
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
b
<xsl:apply-templates select="/xml/data/firmenliste" />
</xsl:template>
<xsl:template match="firmenliste">
A
</xsl:template>
</xsl:stylesheet>