网站建设qq,软件开发工具的基础,光遇网页制作素材,乔拓云智能建站异步加载js文件并执行js方法#xff1a;实现异步处理网页的复杂效果 有这么一个场景#xff0c;当你的网页页面效果过多就会造成了打开页面的速度变得缓慢#xff0c;长时间处于加载的状态#xff0c;这样的效果通常会让用户感到不友好#xff0c;通常的处理方法是先…异步加载js文件并执行js方法实现异步处理网页的复杂效果 有这么一个场景当你的网页页面效果过多就会造成了打开页面的速度变得缓慢长时间处于加载的状态这样的效果通常会让用户感到不友好通常的处理方法是先加载基本的html然后再加载其他的网页效果让用户感觉到页面一下子就出来了然后其他的网页效果再慢慢的展现出来。 这里通过JSLoader组件来实现这种前端的效果 var JSLoader function(){ var scripts {}; // scripts[a.js] {loaded:false,funs:[]} function getScript(url){ var script scripts[url]; if (!script){ script {loaded:false, funs:[]}; scripts[url] script; add(script, url); } return script; } function run(script){ var funs script.funs, len funs.length, i 0; for (; ilen; i){ var fun funs.pop(); fun(); } } function add(script, url){ var scriptdom document.createElement(script); scriptdom.type text/javascript; scriptdom.loaded false; scriptdom.src url; scriptdom.onload function(){ scriptdom.loaded true; run(script); scriptdom.onload scriptdom.onreadystatechange null; }; //for ie scriptdom.onreadystatechange function(){ if ((scriptdom.readyState loaded || scriptdom.readyState complete) !scriptdom.loaded){ run(script); scriptdom.onload scriptdom.onreadystatechange null; } }; document.getElementsByTagName(head)[0].appendChild(scriptdom); } return { load: function(url){ var arg arguments, len arg.length, i 1, script getScript(url), loaded script.loaded; for (; ilen; i){ var fun arg[i]; if (typeof fun function){ if (loaded) { fun(); }else{ script.funs.push(fun); } } } } }; }(); 调用方法示例 先在页面上加载JSLoader.js文件 然后执行 JSLoader.load(js/test.js , function () {a();}) 表示异步加载test.js文件并且加载完成后再执行a()方法a()方法是test.js里面的方法a()方法就是负责渲染一些前端页面的网页效果来的。 不过该方法在ie7下并不会产生异步的效果在ie7下需要使用延时触发器来包装一下如 setTimeout( JSLoader.load(js/test.js , function () {a();}), 1);
