Skip to content

Instantly share code, notes, and snippets.

Embed
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);
}
load('//apis.google.com/js/plusone.js');
load('//platform.twitter.com/widgets.js');
load('//s.widgetsite.com/widget.js');
}());
@mgoulart

This comment has been minimized.

Copy link

@mgoulart mgoulart commented Mar 14, 2013

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.

@zenorocha

This comment has been minimized.

Copy link
Owner Author

@zenorocha zenorocha commented Mar 14, 2013

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

This comment has been minimized.

Copy link

@mgoulart mgoulart commented Mar 14, 2013

Very true! Good point =)

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

@eduardo-matos

This comment has been minimized.

Copy link

@eduardo-matos eduardo-matos commented Mar 14, 2013

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

@wesleyvicthor

This comment has been minimized.

Copy link

@wesleyvicthor wesleyvicthor commented Mar 14, 2013

common approach.

@zenorocha

This comment has been minimized.

Copy link
Owner Author

@zenorocha zenorocha commented Mar 15, 2013

How about now?

@harry1989

This comment has been minimized.

Copy link

@harry1989 harry1989 commented Mar 20, 2013

Shouldn't

}());

be

})(); ?

@thefrontender

This comment has been minimized.

Copy link

@thefrontender thefrontender commented Mar 21, 2013

@harry1989 Both are valid Javascript. But if you want an opinionated answer, try Crockford http://www.youtube.com/watch?v=taaEzHI9xyY&feature=youtu.be#t=33m39s

@jswebschmiede

This comment has been minimized.

Copy link

@jswebschmiede jswebschmiede commented Mar 27, 2013

i use a window onload version. look https://gist.github.com/jswebschmiede/3660918

@coljung

This comment has been minimized.

Copy link

@coljung coljung commented Mar 30, 2013

Similar to this one: https://gist.github.com/necolas/1025811 , although i find that one much better.

@franklinjavier

This comment has been minimized.

Copy link

@franklinjavier franklinjavier commented May 13, 2013

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

@mingyun

This comment has been minimized.

Copy link

@mingyun mingyun commented Nov 9, 2013

good

@3runoDesign

This comment has been minimized.

Copy link

@3runoDesign 3runoDesign commented Dec 20, 2013

goood

@kimmykuang

This comment has been minimized.

Copy link

@kimmykuang kimmykuang commented Dec 11, 2014

i think pass 'document' into scope is better

@ghprod

This comment has been minimized.

Copy link

@ghprod ghprod commented May 15, 2015

Nice 👍

@PokemonAshLovesMyTurkeyAndILikeYouTwo

This comment has been minimized.

Copy link

@PokemonAshLovesMyTurkeyAndILikeYouTwo PokemonAshLovesMyTurkeyAndILikeYouTwo commented Apr 3, 2016

ty babe

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