总结:由于IE6/7/8不支持DOMContentLoaded事件,虽然它支持onreadystatechange事件,但是readyState=complete几乎和onload事件一样,需要等页面中的外部资源加载完后才触发,想要尽快可采用doScroll检测法(仅在非iframe下有效)
1 var turbo = turbo || {}; 2 var W3C = document.addEventListener ? true : false; 3 var doc = document, html = document.documentElement; 4 var readyList = []; 5 turbo.ready = function(fn) { 6 //不管是哪个分支,只要触发过一次ready事件readyList就会为null 7 if (readyList) { 8 readyList.push(fn); 9 } else { 10 fn(); 11 } 12 }; 13 function fireReady() { 14 if (readyList && readyList.length) { 15 for (var i = 0, len = readyList.length; i < len; i++) { 16 var fn = readyList[i]; 17 fn(); 18 } 19 } 20 readyList = null; 21 } 22 23 function doScrollCheck() { 24 try { 25 html.doScroll('left'); 26 fireReady(); 27 } catch (e) { 28 setTimeout(doScrollCheck, 50); 29 } 30 } 31 32 var ready = W3C ? "DOMContentLoaded" : "readystatechange"; 33 //由于firefox3.6不支持readyState,则在不支持readyState的时需手动赋值给它 34 if (!doc.readyState) { 35 //如果doc.body已存在则说明domcontentloaded了,将doc.readySate设置为complete 36 var readyState = doc.readySate = doc.body ? "complete" : "loading"; 37 } 38 39 if (doc.readyState == 'complete') { 40 fireReady(); 41 } else { 42 $.bind(doc, ready, function() { 43 if (W3C || doc.readyState == 'complete') { 44 fireReady(); 45 //firefox3.6,我觉得这里设不设置都行,因为这里已经用不到了doc.readyState了 46 if (readyState) { 47 doc.readyState = 'complete'; 48 } 49 } 50 }) 51 //ie下使用doScroll,尽量提前触发ready,此方法只在非iframe下的页面有效 52 var top = false; 53 try { 54 top = doc.frameElement == null && doc.documentElement; 55 } catch (e) {} 56 if (top && top.doScroll) { 57 doScrollCheck(); 58 } 59 }
有点看不懂mass里最后一段调用doScrollCheck的代码,故采用的jQuery的写法.