How to transform this script to be called from a jquery event?

Question

I have the following script which I would like to transform into something I can call from a click:

<script type="text/javascript"> if (!window.mstag) mstag = {loadTag : function(){},time : (new Date()).getTime()};</script> 
<script id="mstag_tops" type="text/javascript" src="//flex.msn.com/mstag/site/+values+/mstag.js"></script> 
<script type="text/javascript"> mstag.loadTag("analytics", {dedup:"1",domainId:"+values+",type:"1",actionid:"+values+"})</script> 
<noscript> <iframe src="//flex.msn.com/mstag/tag/+values+/analytics.html?dedup=+values+" frameborder="0" scrolling="no" width="1" height="1" style="visibility:hidden;display:none"> </iframe> </noscript>

I want to do it the same way in which the following script:

<script type="text/javascript">
/* <![CDATA[ */
var google_conversion_id = +values+;
var google_conversion_language = "en";
var google_conversion_format = "+values+";
var google_conversion_color = "ffffff";
var google_conversion_label = "+values+";
var google_remarketing_only = false;
/* ]]> */
</script>
<script type="text/javascript" src="//www.googleadservices.com/pagead/conversion.js">
</script>
<noscript>
<div style="display:inline;">
<img height="1" width="1" style="border-style:none;" alt="" src="//www.googleadservices.com/pagead/conversion/+values+/?label=+values+;script=0"/>
</div>
</noscript>

was handled in this thread, with the following suggested solution:

---

// This takes care of it for jQuery. Code can be easily adapted for other javascript libraries:

        function googleTrackingPixel() {
            // set google variables as globals
            window.google_conversion_id = 1117861175
            window.google_conversion_language = "en"
            window.google_conversion_format = "3"
            window.google_conversion_color = "ffffff"
            window.google_conversion_label = "Ll49CJnRpgUQ9-at5QM"
            window.google_conversion_value = 0

            var oldDocWrite = document.write // save old doc write

            document.write = function(node){ // change doc write to be friendlier, temporary
                $("body").append(node)
            }

            $.getScript("http://www.googleadservices.com/pagead/conversion.js", function() {

                setTimeout(function() { // let the above script run, then replace doc.write
                    document.write = oldDocWrite
                }, 100)

            })
        }

// and you would call it in your script on the event like so:

$("button").click( function() {
   googleTrackingPixel()
})

---

But since the original script snippets are different in their structure, I don't know how to do it the same way. How can this one be transformed as well?

EDIT: Should I do it this way? -

        function newScript() {
            if (!window.mstag) mstag = {loadTag : function(){},time : (new Date()).getTime()};
            mstag.loadTag("analytics", {dedup:"1",domainId:"+values+",type:"1",actionid:"+values+"})


            var oldDocWrite = document.write // save old doc write

            document.write = function(node){ // change doc write to be friendlier, temporary
                $("body").append(node)
            }

            $.getScript("//flex.msn.com/mstag/site/+values+/mstag.js", function() {

                setTimeout(function() { // let the above script run, then replace doc.write
                    document.write = oldDocWrite
                }, 100)

            })
        }

Answer 1

OK,

If I understand you correctly, you just want to encapsulate the script into a function, so that it can be bound to the click event of an object.

You will need to keep these where they are, the one line imports mstag.js (a javascript library), and we don't need to worry about the iframe.

<script id="mstag_tops" type="text/javascript" src="//flex.msn.com/mstag/site/+values+/mstag.js"></script> 
<noscript> <iframe src="//flex.msn.com/mstag/tag/+values+/analytics.html?dedup=+values+" frameborder="0" scrolling="no" width="1" height="1" style="visibility:hidden;display:none"> </iframe>   </noscript>

The other two lines can be separated into a function as follows:

<script type="text/javascript"> 

    function newScript() 
    {
        if (!window.mstag) 
        {
            mstag = { loadTag : function() {}, time : (new Date()).getTime()
        };

        mstag.loadTag("analytics", { dedup : "1", domainId: "+values+", type : "1", actionid : "+values+" });
    }

</script> 

You will then be able to bind this function to a click event of an object with the jQuery you mentioned:

$("button").on("click", newScript);