XSLT: Include the Javascript in XML

0
votes

I have an XML(XHTML) file which I'm transforming into another XML file by using XSLT. I'm able to transform all the contents successfully but I need to include one Javascript in the output file which I'm unable to include. Can anyone please tell me that how can I include a javascript in the output file by using XSLT.

My Input file:

<?xml version="1.0" encoding="utf-8"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-type" content="text/html;  charset=utf-8" />
    </head>  
    <body>
     <div class="TF" id="id8">
      <div class="iDev">
        <div class="q">
              T <input type="radio" name="o0" id="t0" onclick="getFeedback()"/> 
            </div>
      </div>
     </div>
    </body>
    </html>

Desired Output

<?xml version="1.0" encoding="utf-8"?>
        <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
        <html xmlns="http://www.w3.org/1999/xhtml">
        <head>
        <meta http-equiv="Content-type" content="text/html;  charset=utf-8" />
        </head>  
        <body>
         <div class="QT" id="id10">
         <script type="text/javascript">
         <!-- //<![CDATA[
            var numQuestions = 4;
            var rawScore = 0;
            var actualScore = 0;
           function getAnswer()
           {
          }
            function calulate()
           {
          }
          //]]> -->
         </script>
          <div class="iDev">
            <div class="q">
              T <input type="radio" name="o0" id="t0" onclick="getFeedback()"/> 
            </div>
          </div>
         </div>
        </body>
       </html>

XSLT Part:

<xsl:template match="xhtml:div[@id='id8']/@*">
  <xsl:attribute name="class">QT</xsl:attribute>
   <xsl:attribute name="id">id10</xsl:attribute>
   <script type="text/javascript">
   <![CDATA[
            var numQuestions = 4;
            var rawScore = 0;
            var actualScore = 0;
           function getAnswer()
           {
          }
            function calulate()
           {
          }
          ]]>
          </script>
</xsl:template>

I have created identity template and changed the values of attributes where-ever it was required according to the desired output but still I don't know how can I include the javascript after <div class="TF" id="id8"> this tag. Thanks!

3
xmlxsltxhtmlxslt-1.0

3 Answers

1
votes

Plese try following xsl: 

<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    xmlns:msxsl="urn:schemas-microsoft-com:xslt" exclude-result-prefixes="msxsl">
  <xsl:output method="xml" indent="yes"/>
  <xsl:template match="@* | node()">
    <xsl:copy>
      <xsl:apply-templates select="@* | node()"/>
    </xsl:copy>
  </xsl:template>
  <xsl:template match="div[@id='id8']">
    <xsl:element name="div">
      <xsl:attribute name="class">QT</xsl:attribute>
      <xsl:attribute name="id">id10</xsl:attribute>
    </xsl:element>
    <script type="text/javascript">
      <![CDATA[         
       var numQuestions = 4;             
       var rawScore = 0;             
       var actualScore = 0;            
       function getAnswer()            
       {           
       }             
       function calulate()            
       {           
       }           
       ]]>
    </script>
  </xsl:template>
</xsl:stylesheet>

Edited

Input xml file is this: 

    <?xml version="1.0" encoding="utf-8"?>
<html>
  <head>
    <meta http-equiv="Content-type" content="text/html;  charset=utf-8" />
  </head>
  <body>
    <div id="id8">
    </div>
      <div class="iDev">
        <div class="q">
          T <input type="radio" name="o0" id="t0" onclick="getFeedback()"/>
        </div>
      </div>
  </body>
</html>

Output xml is this: 

<?xml version="1.0" encoding="utf-8"?>
<html>
<head>
<meta http-equiv="Content-type" content="text/html;  charset=utf-8" />
</head>
<body>
<div class="QT" id="id10" /><script type="text/javascript">

       var numQuestions = 4;             
       var rawScore = 0;             
       var actualScore = 0;            
       function getAnswer()            
       {           
       }             
       function calulate()            
       {           
       }           

    </script>
  <div class="iDev">
    <div class="q">
      T <input type="radio" name="o0" id="t0" onclick="getFeedback()" />
    </div>
  </div>
</body>
</html>

I hope this will help you...

1
votes

Forget about the commenting, and just put the JavaScript code in a CDATA section. Few browsers these days have an issue with the bare script being in a <script> node.

0
votes

I have tried the following way as per the suggestions given here and it works perfectly. In case if anyone else is facing the same problem then try this-

<xsl:stylesheet version="1.0"
   xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
   xmlns:xhtml="http://www.w3.org/1999/xhtml"
   xmlns="http://www.w3.org/1999/xhtml"
   exclude-result-prefixes="xhtml">
<xsl:output method="html" indent="yes" encoding="UTF-8"/>
<xsl:strip-space elements="*" />
   <xsl:template match="@*|node()">
     <xsl:copy>
        <xsl:apply-templates select="@*|node()"/>
     </xsl:copy>
   </xsl:template>

    <xsl:template match="xhtml:div[@id='id8']" xmlns="http://www.w3.org/1999/xhtml">
    <div id="id10" class="QT">
        <xsl:apply-templates select="
          (@*[local-name()!='id']
             [local-name()!='class'])
          | node()"/>
      </div>
        <script type="text/javascript">
          <![CDATA[         
           var numQuestions = 4;             
           var rawScore = 0;             
           var actualScore = 0;            
           function getAnswer()            
           {           
           }             
           function calulate()            
           {           
           }           
           ]]>
        </script>
    </xsl:template>
<xsl:stylesheet>