preserve/generate ">" and "<" in XSL transformation for JavaScript embedded in HTML

olafberg
Posts: 2
Joined: Sun Jul 17, 2022 7:00 pm

preserve/generate ">" and "<" in XSL transformation for JavaScript embedded in HTML

Post by olafberg »

I'm working on a XSLT transformation for TEI P5 to HTML 5. I want to embed some JavaScript code in the resulting HTML 5 file. This includes the line:

var scrolled = $(window).scrollTop();
if (scrolled > 2) { $('.headline').css('top', headline_bottom+(scrolled * 0.15) + 'px'); }

Obviously, the problem here is to handle correctly the ">" sign that in an XML context is reserved for closing a Tag.
When I write this into my XSLT file, the ">" sign get processed into an entity version as "&gt;" in the resulting HTML file, which obviously does not work well as embedded JavaScript code.
I noted that if I put a script line with an "<" sign inside a <xsl:comment> line, and write it in the XSLT file as an entity, it gets transformed into a "<" sign in the resulting HTML file:
XSLT:
<xsl:comment>if (windowHeight &lt; 600) { $('.author_content').css( "position", "relative" );} </xsl:comment>
HTML:
<!--if (windowHeight < 600) { $('.author_content').css( "position", "relative" );} -->

Unfortunately, this does not work outside a comment Element in the script line above. If I write it as entity in the XSLT file, it gets anyway rendered as &gt; entity.
When I manually change the &gt; entity into a ">" sign in the script part of the resulting html5 file, I get no error on the validation of the HTML 5 file (as it should be, as this is part of embedded JavaScript).
Is there a possibility to generate a correct ">" (and "<") sign in the script part into the HTML file with my XSL transformation?
tavy
Posts: 364
Joined: Thu Jul 01, 2004 12:29 pm

Re: preserve/generate ">" and "<" in XSL transformation for JavaScript embedded in HTML

Post by tavy »

Hello,

I think you can enter the JavaScript code into an xsl: text element and set disable-output-escaping="yes". Something like that:

Code: Select all

<xsl:text disable-output-escaping="yes">
    var scrolled = $(window).scrollTop();
    if (scrolled > 2 | scrolled &lt; 20) { $('.headline').css('top', headline_bottom+(scrolled * 0.15) + 'px'); }
</xsl:text>
Best Regards,
Octavian
Octavian Nadolu
<oXygen/> XML Editor
http://www.oxygenxml.com
Post Reply