问题场景:需要在运行时动态加载一个JavaScript脚本文件
var s = document.createElement('script'); s.type = 'text/javascript'; s.async = false; s.src = url; document.body.appendChild(s);
问题场景:需要在动态加载一个JavaScript脚本文件之后,执行相应代码
function load_js(url, callback){ var s = document.createElement('script'); s.type = 'text/javascript'; s.async = false; s.src = url; if(s.addEventListener) { s.addEventListener("load",callback,false); } else if(s.readyState) { // For IE s.onreadystatechange = callback; } document.body.appendChild(s);
问题场景:不同的代码都需要动态加载同一个JavaScript脚本文件,但显然只要需要加载一次就够了
来自http://design-noir.de/webdev/JS/loadScript/的一个实现(略有修改):
function loadScript(url, callback) { var f = arguments.callee; if (!("queue" in f)) f.queue = {}; var queue = f.queue; if (url in queue) { // script is already in the document if (callback) { if (queue[url]) // still loading queue[url].push(callback); else // loaded callback(); } return; } queue[url] = callback ? [callback] : []; var s = document.createElement("script"); s.type = "text/javascript"; s.onload = s.onreadystatechange = function() { if (s.readyState && s.readyState != "loaded" && s.readyState != "complete") return; s.onreadystatechange = s.onload = null; while (queue[url].length) queue[url].shift()(); queue[url] = null; }; s.src = url; document.body.appendChild(s); }