Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
Loading multiple 3rd party widgets asynchronously
(function() {
var script,
scripts = document.getElementsByTagName('script')[0];
function load(url) {
script = document.createElement('script');
script.async = true;
script.src = url;
scripts.parentNode.insertBefore(script, scripts);

If there's no previous script tag on the page, won't scripts.parentNode throw a (Cannot read property parentNode of undefined) error ?

also any for in loop should use hasOwnProperty to protect for any prototype modifications on the page.

  1. You're always going to have a script tag on the page, because you need to add the script above somehow

Very true! Good point =)

You also might want to wrap this in a function to protect the variable namespaces.


As you don't use the object keys, maybe it would be better to loop an array instead (performance).


common approach.


How about now?





})(); ?


@harry1989 Both are valid Javascript. But if you want an opinionated answer, try Crockford


i use a window onload version. look

coljung commented Mar 30, 2013

Similar to this one: , although i find that one much better.


How about to pass the "document" as parameter into scope?

mingyun commented Nov 9, 2013





i think pass 'document' into scope is better

ghprod commented May 15, 2015

Nice 👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment