如果要让beforeunload事件生效，必须满足以下两个条件之一：1、事件处理程序返回一个真值；2、事件对象event.returnValue返回一个真值。如果两个条件同时满足，则以第一个条件为准
chrome/safari/firefox在对话框中不显示指定文本，只显示默认文本。而IE浏览器会在对话框中显示返回值或returnValue值
window.onbeforeunload = function(e){ e = e || event; //IE浏览器显示指定文本，其他浏览器显示默认文本 e.returnValue = '要离开吗？'; }
DOMContentLoaded
window的onload事件会在页面中的一切都加载完毕时触发，但这个过程可能会因为要加载的外部资源过多而颇费周折。而DOMContentLoaded事件则在形成完整的DOM树之后就会触发，而不理会图像、javascript文件、CSS文件或其他资源是否下载完毕。与load事件不同，DOMContentLoaded支持在页面下载的早期添加事件处理程序，这也就意味着用户能够尽早地与页面进行交互
[注意]网页的javascript脚本是同步执行的，所以定义DOMContentLoaded事件的监听函数，应该放在所有脚本的最前面。否则脚本一旦发生堵塞，将推迟触发DOMContentLoaded事件
要处理DOMContentLoaded事件，可以为document或window添加相应的事件处理程序，尽管这个事件会冒泡到window，但它的目标实际上是document
[注意]IE8-浏览器不支持该事件
window.addEventListener('DOMContentLoaded',function(e){ console.log(1); })
对于不支持该事件的浏览器如IE8-浏览器，可以在页面加载期间设置一个时间为0毫秒的超时调用，且必须作为页面的第一个超时调用
setTimeout(function(){ console.log(1); },0)
readystatechange
readystatechange事件发生在Document对象和XMLHttpRequest对象，它们的readyState属性发生变化时触发
这个事件的目的是提供与文档或元素的加载状态有关的信息。支持readystatechange事件的每个对象都有一个readyState属性，可能包含下列5个值中的一个
uninitialized(未初始化)：对象存在但尚未初始化 loading(正在加载)：对象正在加载数据 loaded(加载完毕)：对象加载数据完成 interactive(交互)：可以操作对象了，但还没有完全加载 complete(完成)：对象已经加载完毕
这些状态看起来很直观，但并非所有对象都会经历readyState的这几个阶段。换句话说，如果某个阶段不适用某个对象，则该对象完全可能跳过该阶段；并没有规定哪个阶段适用于哪个对象。显然，这意味着readystatechange事件经常会少于4次，而readyState属性的值也不总是连续的
对于document而言，值为"interactive"的readyState会在与DOMContentLoaded大致相同的时刻触发readystatechange事件。此时，DOM树已经加载完毕，可以安全地操作它了，因此就会进入交互(interactive)阶段。但与此同时，图像及其他外部文件不一定可用
//'interactive' 'complete' document.onreadystatechange = function(e){ if(document.readyState == 'uninitialized'){ console.log('uninitialized'); } if(document.readyState == 'loading'){ console.log('loading'); } if(document.readyState == 'loaded'){ console.log('loaded'); } if(document.readyState == 'interactive'){ console.log('interactive'); } if(document.readyState == 'complete'){ console.log('complete'); } }
在与load事件一起使用时，无法预测两个事件触发的先后顺序。在包含较多或较大的外部资源的页面中，会在load事件触发之前先进入交互阶段；而在包含较少或较小的外部资源的页面中，则很难说readystatechange事件会发生在load事件前面
让问题变得更复杂的是，交互阶段可能会早于也可能会晚于完成阶段出现，无法确保顺序。在包含较多外部资源的页面中，交互阶段更有可能早于完成阶段出现；而在页面中包含较少外部资源的情况下，完成阶段先于交互阶段出现的可能性更大。因此，为了尽可能抢到先机，有必要同时检测交互和完成阶段
document.onreadystatechange = function(){ if(document.readyState == 'interactive' || document.readyState == 'complete'){ console.log('loaded'); document.onreadystatechange = null; } }