web api instance method
XSLTProcessor: transformToDocument() method
The transformToDocument() method of the XSLTProcessor interface transforms the provided Node source to a Document using the XSLT stylesheet associated with XSLTProcessor.
Syntax
transformToDocument(source)
Parameters
source- : The
Nodesource to apply the XSLT stylesheet to.
- : The
Return value
A Document. The actual interface depends on the output method of the stylesheet, as specified by <xsl:output> element’s method.
| Output method | Result interface |
|---|---|
html | HTMLDocument |
xml | XMLDocument |
text | XMLDocument with a single root element <transformiix:result> with the text as a child |
Examples
Using transformToDocument()
This example demonstrates how to use transformToDocument() to transform an XML document using XSLT, resulting in a new XML document structure.
HTML
<pre id="result"></pre>
JavaScript
const xmlString = `
<books>
<book>
<title>Book 1</title>
<author>Author 1</author>
</book>
<book>
<title>Book 2</title>
<author>Author 2</author>
</book>
</books>
`;
const xsltString = `
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="xml" indent="yes"/>
<xsl:template match="/">
<catalog>
<xsl:for-each select="books/book">
<item>
<name><xsl:value-of select="title"/></name>
<writer><xsl:value-of select="author"/></writer>
</item>
</xsl:for-each>
</catalog>
</xsl:template>
</xsl:stylesheet>
`;
const parser = new DOMParser();
const xmlDoc = parser.parseFromString(xmlString, "application/xml");
const xsltDoc = parser.parseFromString(xsltString, "application/xml");
const xsltProcessor = new XSLTProcessor();
xsltProcessor.importStylesheet(xsltDoc);
// Perform the transformation, returning the result as a new XML document
const resultDoc = xsltProcessor.transformToDocument(xmlDoc);
// Serialize the result document to a string
const serializer = new XMLSerializer();
const resultString = serializer.serializeToString(resultDoc);
// Display the transformed XML in the page
document.getElementById("result").textContent = resultString;
Result
Interactive exampleOpen the canonical MDN source to run this embedded demo.
Specifications
SpecificationsStandards references are available on the canonical MDN page.
Browser compatibility
Browser compatibilityCompatibility data is available on the canonical MDN page.