I have an XSLT file for styles in XML. The XSLT is accessible via a URL (http://someurl/somefile.xsl) without problems.
When I insert the same URL into an xml-stylesheet
processing instruction, it only renders plain text in browsers (FF, IE),
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="http://someurl/somefile.xsl"?>
<rootElement>...</rootElement>
but when I use a local file path (file downloaded to same folder as the XML file), it works like a charm:
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="somefile.xsl"?>
<rootElement>...</rootElement>
Why?
Running XSLT in a Web Browser
Running XSLT in the browser is subject to some limitations:
For these reasons, XSLT is more often run on the server or in batch mode rather than in the browser.
If you wish to run XSLT in the browser and have it work with Chrome, Firefox, and IE, you must
- Use XSLT 1.0 only, not XSLT 2.0.
Use an xml-stylesheet
processing instruction in the XML file as you've done to link the XSLT file with the XML file:
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="http://origin-domain/path/to/file.xsl"?>
<rootElement>...</rootElement>
- Serve the XSLT from a server, not from a local file.
- Make sure that the XSLT originates from the same domain as the XML.
Finally, be sure to check the browser console for any error messages. For example, here's what IE shows when the XSLT cannot be located:
Since this answer is being linked to from other questions, I will add an update: it is now possible to run XSLT 3.0 stylesheets in the browser using the Saxon-JS implementation. This lifts many of the limitations present with the built-in XSLT processors that come with the various browsers.