Hey Mathew.
I've successfully done something similar to what your trying to achieve.
My own attempt was in IE. I've created a function that takes the XML and
XSL URL's as parameters, transforms the xml, then places the resulting
xhtml into a div box that is also specified as a parameter. For the
function to work, you need to have specified the div box earlier in the
html... you don't need to put anything in it, just specify it. Because
this was made for IE, you'll need to tweak the code for a Gecko browser
and replace the 'ActiveXObject' objects.
The code is as follows:
function transformXML(xmlDocURL, xslDocURL, divID)
{
// define the local variables
var xmlDoc, xslDoc, xslTemplate, xslProcessor;
// instantiate and load the xml document
xmlDoc = new ActiveXObject("MSXML2.DomDocument");
xmlDoc.async = false;
xmlDoc.load(xmlDocURL);
// instansiate and load the passed xsl stylesheet
xslDoc = new ActiveXObject("MSXML2.FreeThreadedDomDocument");
xslDoc.async = false;
xslDoc.load(xslDocURL);
// instansiate and define an xsl template
xslTemplate = new ActiveXObject("MSXML2.XSLTemplate");
xslTemplate.stylesheet = xslDoc;
// instansiate and define an xsl processor
xslProcessor = xslTemplate.createProcessor();
xslProcessor.input = xmlDoc;
// note: if you want to pass parameters to the xsl stylesheet just
prior to
// transforming the xml document, do it here (see the addParameter()
function)
// for further information.
// transform the xml document into xhtml and display it
xslProcessor.transform();
divID.innerHTML = xslProcessor.output;
}
You call this function as follows:
transformXML("catalog.xml", "main.xsl", main);
transformXML("catalog.xml", "navi.xsl", navi);
I hope this helps you.