Javascript function for loading resources dynamically with onload callback

loadynamic.js

/**
 * Accept three parameters
 * @param {string} type : either js or css
 * @param {string} url : url of the resource to be loaded 
 * @param {function} : function to be called back after resource loaded (Optional)
 */
function loadResource(type, url, callbackFunction) {
  var tag, mimeType;
  if (type == 'js') {
    tag = 'script';
    mimeType = 'text/javascript';
  } else {
    tag = 'link';
    mimeType = 'text/css';
  }
  var head = document.getElementsByTagName('head')[0];
  var resource = document.createElement(tag);
  resource.type = mimeType;
  resource.onreadystatechange = function() {
    if (this.readyState == 'complete')
      callbackFunction();
  }
  if(typeof callbackFunction !== 'undefined')
  resource.onload = callbackFunction;
  if (type == 'js') {
    resource.src = url;
  } else {
    resource.href = url;
    resource.rel = 'stylesheet'
  }
  head.appendChild(resource);
}

/**
 * Example : loading bootstrap css file
 * with callback function alerting load complete
 */
loadResource( 'css', 'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css',
  function(){
    alert('Resource load complete.');
     }
  );