2013-11-29 3 views
1

여기에 HTML 태그가 포함되어 있습니다. xslt 스타일을 적용하려고합니다. javascript로 가져 오는 다른 파일 (somefile.xsl)로 작성되었습니다. 외부 xslt 파일을 자바 스크립트로 가져 오는 스타일을 성공적으로 적용하고 있지만 인터넷 익스플로러에서만 작동합니다. 다른 브라우저에서는 스타일을 적용하지 못했습니다. 벨로우즈는 제 코드를 보시기 바랍니다. 내가 여기서 어디서 잘못하고있는거야? IE를 제외하고 다른 브라우저는이 기술로 작업하지 않는 것 같습니다.JavaScript로 html 안에 xsl 스타일을 적용하는 방법

<HTML> 
    <HEAD> 
    <TITLE>Sample XML with XSL</TITLE> 
     <xml id="elx"> 
      <hello-world> 
      <greeter>An XSLT Programmer</greeter> 
      <greeting>Hello, World! </greeting> 
      </hello-world> 
     </xml> 
    </HEAD> 
    <BODY> 
    <SCRIPT language = "javascript"> 
    if(window.ActiveXObject) 
    { 
    //IE 
     alert("hi"); 
     var xslDoc = new ActiveXObject("Microsoft.XMLDOM"); 
     xslDoc.async = false; 
     xslDoc.load("helloworld.xsl"); 
     document.write(elx.transformNode(xslDoc)); 
} 
else if (document.implementation && document.implementation.createDocument) 
{ 
    //For Other Browsers 

      xsltProcessor=new XSLTProcessor(); 
      xsltProcessor.importStylesheet("helloworld.xsl"); 
      result = xsltProcessor.transformToDocument(elx); 
      // here 'elx' is id of embedded xml in header. 
      document.write(result); 
} 

    </SCRIPT> 
    </BODY> 
    </HTML> 

여기 내 XSL 내가 자바 스크립트로 가져 오려고하고 난 단지 얻을 내 HTML 파일 내에서 html 파일

<?xml version="1.0" encoding="ISO-8859-1" ?> 
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0" > 
<xsl:output method="html" version="1.1" encoding="iso-8859-1" /> 
<xsl:template match="/hello-world"> 
    <HTML> 
     <HEAD> 
      <TITLE> 
      </TITLE> 
     </HEAD> 
     <BODY> 
      <H1> 
       <xsl:value-of select="greeting"/> 
      </H1> 
      <xsl:apply-templates select="greeter"/> 
     </BODY> 
    </HTML> 
</xsl:template> 

내부에 포함 된 XML에 스타일을 추가하고 (helloworld.xsl) 파일입니다 그 xml 파일의 id, 그 XML ID를 사용하여 스타일을 자바 스크립트를 사용하여 적용해야합니다. 내 문제를 이해하시기 바랍니다. 가능한 한 빨리 해결하십시오. 물론 XSL 튜토리얼이다 이동 W3 스쿨 확실히

+0

XML 데이터 섬은 지금까지 HTML에서 마이크로 소프트 지원 기능, 그리고 아마도 다른 브라우저에서 인식되지 때문에 문제가 될 수있다 필요가 없습니다. 실제로 Microsoft는 IE10 이상에서 Microsoft를 더 이상 지원하지 않습니다 (http://msdn.microsoft.com/en-us/library/ie/hh801224(v=vs.85).aspx 참조). 솔루션은 HTML에 포함되지 않고 별도의 파일에 XML을 포함해야한다고 생각합니다. –

답변

0

는 :

http://www.w3schools.com/xsl/xsl_transformation.asp

하지만 원인에

나는 당신의 "다른 브라우저"주변의 경우 문이 의심되는 문제라고 생각합니다.

<yourCode> 
else if (document.implementation && document.implementation.createDocument) 
</yourCode> 

경고문이나 콘솔 로그를 추가하여 해당 If 문을 점검 할 수 있습니까? 또한 왜 두 번째 if 문을 가지고 있습니까? "IE 코드"와 "IE가 아닌 코드"가 있다면 왜 다른 코드에 넣지 않으시겠습니까?

참고

: 코드를 시도하지 않은, 그 감사의 밤 피곤 조금 메신저하지만 몇 가지 생각

+0

예, 'alert()'이 (가) 작동하지 않지만 javascript 명령으로 스타일이 xml id 'elx'에 적용되지 않습니다. -> result = xsltProcessor.transformToDocument (elx); 나는이 코드 줄에서 잘못된 점을 안다. 아무도 발견하지 못하면 해결책이 필요해 .. – Ram

0

이는 importStylesheet는 (파일에 URL이 아닙니다) 개체가 필요합니다, 당신은 domParser

에서 그것을 얻을 수
var domParser = new DOMParser(); 
xsltProcessor.importStylesheet(domParser.parseFromString(some_text_value, "text/xml")); 
외부 파일을 사용하려는 경우, 당신은 stlsh.innerHTML/elx.innerHTML을 변경해야합니다 코드

<HTML> 
<HEAD> 
<script id="elx" type="text/xml"> 
    <hello-world> 
     <greeter>An XSLT Programmer</greeter> 
     <greeting>Hello, World! </greeting> 
    </hello-world> 
</script> 
<script id="stlsh" type="text/xml"> 
    <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0"> 
    <xsl:output method="html" version="1.1" encoding="iso-8859-1" /> 
    <xsl:template match="/hello-world"> 
     <HTML> 
      <BODY> 
       <H1> 
        <xsl:value-of select="greeting"/> 
       </H1> 
       <xsl:apply-templates select="greeter"/> 
      </BODY> 
     </HTML> 
    </xsl:template> 
    </xsl:stylesheet> 
</script> 
</HEAD> 
<BODY> 
<SCRIPT language = "javascript"> 
    var domParser = new DOMParser(); 
    var xsltProcessor = new XSLTProcessor(); 

    xsltProcessor.importStylesheet(domParser.parseFromString(stlsh.innerHTML, "text/xml")); 
    var result = xsltProcessor.transformToDocument(domParser.parseFromString(elx.innerHTML, "text/xml")); 

    document.write(result.firstElementChild.innerHTML); 
</SCRIPT> 
</BODY> 
</HTML> 

에게 다음과 같은 파이어 폭스/Chorme에 대한

전체 게으른 솔루션 responseText를 사용하여 XMLHttpRequest를 domParser에 배치합니다.

또는 XMLHttpRequest의 responseXML.documentElement를 얻을 수 - 수 있으며, domParser는

관련 문제