Clever Geek Handbook

How to avoid Javascript in XQuery function

Is there a way to avoid or do Javascript in the xquery function?

Example:

xquery version "1.0-ml";
module namespace tagmanager = "tagmanager";
declare function tagmanager() { < noscript > < iframe src = "//www.googletagmanager.com/ns.html?id=[value]"
    height = "0"
    width = "0"
    style = "display:none;visibility:hidden" > < /iframe></noscript >
        < script > (function(w, d, s, l, i) {
            w[l] = w[l] || [];
            w[l].push({
                'gtm.start': new Date().getTime(),
                event: 'gtm.js'
            });
            var f = d.getElementsByTagName(s)[0],
                j = d.createElement(s),
                dl = l != 'dataLayer' ? '&l=' + l : '';
            j.async = true;
            j.src =
                '//www.googletagmanager.com/gtm.js?id=' + i + dl;
            f.parentNode.insertBefore(j, f);
        })(window, document, 'script', 'dataLayer', 'value'); < /script>
};
+3


source to share


3 answers


I've always taken an approach to escaping problematic characters and treating HTML as well-formed XML:

(1) avoid problematic characters like ampersands ( &

> &amp;

) and curly braces that just need to be doubled: {

> {{

and }

>}}

(2) if you are serving multiple items, create a sequence: (<element1/>, <element2/>)



Applying this approach to this example:

(
<noscript> 
    <iframe src = "//www.googletagmanager.com/ns.html?id=[value]"
        height = "0"
        width = "0"
        style = "display:none;visibility:hidden"></iframe>
</noscript>,
<script> (function(w, d, s, l, i) {{
        w[l] = w[l] || [];
        w[l].push({{
            'gtm.start': new Date().getTime(),
            event: 'gtm.js'
        }});
        var f = d.getElementsByTagName(s)[0],
            j = d.createElement(s),
            dl = l != 'dataLayer' ? '&amp;l=' + l : '';
        j.async = true;
        j.src =
            '//www.googletagmanager.com/gtm.js?id=' + i + dl;
        f.parentNode.insertBefore(j, f);
    }})(window, document, 'script', 'dataLayer', 'value');
</script>
)

However, I like the CDATA approach - it never occurred to me before!

+2


source


CDATA content does not need escaping. The example is dumb, because you are generating HTML in a lanaguge XML file, I suggest treating the whole thing as a string. An explicit CDATA constructor is only allowed with an element, so you need a wrapper. http://www.w3.org/TR/xquery/#doc-xquery-CDataSectionContents

Example:



xquery version "1.0-ml";
declare namespace html = "http://www.w3.org/1999/xhtml";
declare function local:tagmanager() as xs:string 
{ 
<wrapper> 
<![CDATA[
< noscript > < iframe src = "//www.googletagmanager.com/ns.html?id=[value]"
    height = "0"
    width = "0"
    style = "display:none;visibility:hidden" > < /iframe></noscript >
        < script > (function(w, d, s, l, i) {
            w[l] = w[l] || [];
            w[l].push({
                'gtm.start': new Date().getTime(),
                event: 'gtm.js'
            });
            var f = d.getElementsByTagName(s)[0],
                j = d.createElement(s),
                dl = l != 'dataLayer' ? '&l=' + l : '';
            j.async = true;
            j.src =
                '//www.googletagmanager.com/gtm.js?id=' + i + dl;
            f.parentNode.insertBefore(j, f);
        })(window, document, 'script', 'dataLayer', 'value'); < /script>


]]>
</wrapper>/string()
};

 local:tagmanager()
+3


source


One approach is to put JavaScript in a text file, read with a separate request (which is also useful for browser caching).

Another is to use a CDATA section for the content of the element, for example:

However, you still have to use ampersands for reserved characters (<> '' &) in the CDATA section.

Hope it helps,

+1


source






More articles:


All Articles