Mozilla Gecko_javascript 팁에서 Javascript로 XSL을 로드하는 방법

Mozilla 개발 센터에서 다음 문서를 볼 수 있습니다: http://developer.mozilla.org/en/docs/The_XSLT/JavaScript_Interface_in_Gecko:Basic_Example
우선, xml 파일을 동적으로 로드하는 방법을 이해해야 합니다. XMLDOM 개체를 사용할 수 있고 responseXML 개체인 XMLHttpRequest도 사용할 수 있습니다. 여기서는 XMLHttpRequest를 사용합니다.

javascript를 이용하여 xslt를 로딩하는 방법은 다음과 같습니다.
1. XMLDOM 또는 XMLHttpRequest를 사용하여 xml 및 xslt를 로드합니다.
2. XSLTProcessor.importStylesheet를 사용하여 XSLT를 도입하세요.
3. XSLTProcessor.transformToFragment 메서드를 사용하여 DOM 조각으로 변환합니다. 그런 다음,appendChild 또는 insertBefore 및 기타 메소드를 사용하여 이 DOM의 조각 요소를 추가하거나 삽입하십시오.
예제 코드
var ownerDocument = document.implementation.createDocument("", "test", null);
var newFragment = processor.transformToFragment(domToBeTransformed, ownerDocument)
물론 그럴 수도 있습니다. use 변환ToDocument
var newDocument = processor.transformToDocument(domToBeTransformed);
변환된 노드는 Element 또는 조각이므로 obj.innerHTML=new Document 4. 직렬화.
(new XMLSerializer()).serializeToString(newDocument)
5. IE에서는 XMLDOM 메서드와 xmldoc.transformNode(xslDocument) 메서드를 사용하여 직접 변환을 수행할 수 있습니다.

먼저 나중에 설명하기 쉽도록 XML 파일과 XSLT 파일을 만듭니다.
foo.xml

ie 및 mozilla에서 javascript 로드 xslt
온라인에 연결되지 않음
http://www.never-online.net
콘텐츠는 여기

foo.xsl

foo.html


nbsp;html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/tr/html4/strict.dtd">

javascript를 사용하여 xsl 변환 - http://www.never-online.net





.desc { 여백:10px 10% 0 10%; center; }
.box { 여백:10px 10% 0 10%; 테두리: 1px 점선 #639ACE; }

<script> <BR> //<![CDATA[ <br><br> //]]> <BR> </script><script> <BR>//<![CDATA[ <BR> var xsltParser = function(xmlfileStr, xslfileStr) { <BR> var retval = xslStylesheet = xmlDocument = null; <BR> var browser = { <BR> isIE:!!window.ActiveXObject, <BR> isMozilla:(typeof document.implementation != 'undefined') && (typeof document.implementation.createDocument != 'undefined') && (typeof HTMLDocument!='undefined') <BR> }; <BR> var loadDocument = function (fileStr) { <BR> if (!fileStr) throw new Error([65221, "调用XMLHTTP错误，没有指定文件名。"]); <BR> var req = browser.isIE?new ActiveXObject("MSXML2.XMLHTTP"):new XMLHttpRequest(); <BR> req.open("GET", fileStr, false); <BR> req.send(null); <BR> if (req.readyState==4 && req.status==200) { return req.responseXML; } <BR> else throw new Error([65222, "调用XMLHTTP错误，远程文件失败。"+fileStr+""]); <BR> }; <BR> var ready2Transform = function () { <BR> xmlDocument = loadDocument(xmlfileStr); <BR> xslStylesheet = loadDocument(xslfileStr); <BR> }(); <BR> var parseFromMoz = function () { <BR> var xsltProcessor = new XSLTProcessor(); <BR> xsltProcessor.importStylesheet(xslStylesheet); <BR> var retval = xsltProcessor.transformToDocument(xmlDocument); <BR> return (new XMLSerializer()).serializeToString(retval);//序列化 <BR> }; <BR> var parseFromIE = function () { <BR> return xmlDocument.transformNode(xslStylesheet.documentElement); <BR> }; <BR> if (browser.isMozilla) { <BR> retval = parseFromMoz(xmlfileStr, xslfileStr); <BR> } <BR> else if (browser.isIE) { <BR> retval = parseFromIE(xmlfileStr, xslfileStr); <BR> } else { /* TO DO */ ;}; return retval; <BR> } <BR> document.getElementById("demo").innerHTML=xsltParser("foo.xml","foo.xsl") <BR>//]]> <BR></script>