Dynamically insert a script tag without calling function

Question

I'm trying to dynamically insert the following:

var downloadJsOnLoad = function () {

    var shareThisOne = document.createElement('script');
    shareThisOne.text = 'var switchTo5x=true;';
    document.body.appendChild(shareThisOne);

    var shareThisTwo = document.createElement('script');
    shareThisTwo.src = 'http://w.sharethis.com/button/buttons.js';
    document.body.appendChild(shareThisTwo);

    var text = 'stLight.options({publisher: "a8cae9ce-ebee-4346-9891-a1bfb0aa7005"});';

    var shareThisThree = document.createElement('script');
    shareThisThree.innerHTML = text;
    document.body.appendChild(shareThisThree);

}

jQuery(window).load(function () {
    downloadJsOnLoad();
});

Everything works, but I get an error when this javascript is parsed that says stLight is undefined. I'm assuming that it is looking at the stLight.options method as an executable rather than a plain string. How can I get around this to avoid the error?

This error means stLight is not there at all. Are you loading the file that contains the definition of it correctly? — pimvdb
– pimvdb, Commented Oct 8, 2012 at 18:54
I'm loading the file that contains stLight right before I add this. — user699242
– user699242, Commented Oct 8, 2012 at 19:05
When loading the file, do you use onload? See: jsfiddle.net/3BMrL. — pimvdb
– pimvdb, Commented Oct 8, 2012 at 19:08

pimvdb · Accepted Answer · 2012-10-08 19:35:57Z

1

Use onload to make sure the ShareThis code (i.e. the stLight variable) exists when using it:

shareThisTwo.onload = function() {
    var text = 'stLight.options({publisher: "a8cae9ce-ebee-4346-9891-a1bfb0aa7005"});';

    var shareThisThree = document.createElement('script');
    shareThisThree.innerHTML = text;
    document.body.appendChild(shareThisThree);
};

That said, why not just discard the last element creation? You just want to execute code.

shareThisTwo.onload = function() {
    stLight.options({publisher: "a8cae9ce-ebee-4346-9891-a1bfb0aa7005"});
};

edited Oct 8, 2012 at 19:35

answered Oct 8, 2012 at 19:25

pimvdb

155k80 gold badges313 silver badges357 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

user699242 Over a year ago

This was a great suggestion. I set the first tag to a global variable because that's what it was anyway, then added the second script tag dynamically, then just executed the final statement. Worked great!! Thank you for your suggestion.

Collectives™ on Stack Overflow

Dynamically insert a script tag without calling function

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related