JavaScript - Dynamic Load script || JSONP Callback
Table of Contents
#
JavaScript - Dynamic Load script || JSONP Callback
##
Intro
Sometimes we need dynamic load script or handle jsonp callback
And we need handle script onload or jsonp callback onload or something error
##
How to do?
Use onload
, onerror
method
##
Code
if (typeof UTIL == 'undefined' || !UTIL) {
var UTIL = {};
}
UTIL.createEl = {
get: function(sTag, oAttr, handleOnLoad, handleError) {
var el = document.createElement(sTag);
for (var i in oAttr) {
el[i] = oAttr[i];
}
if (handleOnLoad) {
el.onload = handleOnLoad;
}
if (handleError) {
el.onerror = handleError;
}
this.append(el);
return el;
},
append: function(dNode) {
var dHead = document.getElementsByTagName('head')[0] || document.body;
dHead.appendChild(dNode);
},
remove: function(dNode) {
setTimeout(function() {
dNode.parentNode.removeChild(dNode);
dNode = null;
}, 0);
},
js: function(sUrl, handleOnLoad, handleError) {
var dNode = this.get('script', {
src: sUrl,
type: 'text/javascript'
}, handleOnLoad, handleError);
return dNode;
},
css: function(sUrl, sMedia) {
if (!sMedia) {
sMedia = 'all';
}
return this.get('link', {
'href':sUrl,
'rel':'stylesheet',
'type':'text/css',
'media':sMedia
});
}
};
##
Example
var run = function() {
alert('OK');
},
errorHandle = function() {
alert('Error');
};
UTIL.createEl.js('http://tysh310246.blogspot.com/feeds/posts/default?alt=json&callback=myFunction', run, errorHandle);
function myFunction (data) {
console.log(data);
}
Refer - JavaScript Madness: Dynamic Script Loading Refer - Script Loading issue « 小莊記事