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.


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

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.


zenorocha commented Mar 15, 2013

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