最近学习javacript看到个DOMContentLoaded事件,找了下资料看看,为了方便记忆,把学到的记录下来,其实和它和onload是有区别的,DOMContentLoaded事件是当初始HTML文档完全被加载和解析(即所有的DOM完全解析)时触发的,无需要等待样式列表,图片,子框架完成加载,而onload事件它要等页面所有元素,包括图片 以及脚本等全部加载完成才触发,因此它比DOMContentLoaded要更晚执行。
//onload事件 是所有标签 图片 样式 及脚本加载完成是触发
window.onload=function(){
var span=document.querySelector("span");
console.log(span,"onload");
}
//DOMContentLoaded事件是所有DOM元素解析完成是触发(HTML文档被完全加载和解析)
//这个要IE9以上才兼容
document.addEventListener("DOMContentLoaded",function(){
var span=document.querySelector("span");
console.log(span,"DOMConetentLoaded")
})
可以看的出DOMContentLoaded要快比onload要快
//为了兼容IE9及以下的版本
document.attachEvent("onreadystatechange",function(){
var span=document.querySelector("span");
//这里要判断一下
if(document.readyState=="complete"){
console.log(span,"onreadystatechange")
}
})