onload、DOMContentLoaded区别

作者: 时间的溺水者 | 来源:发表于2022-05-21 22:20 被阅读0次

window.onload 和 DOMContentLoaded
js复习
运行环境—页面加载和渲染过程
慕课网《前端JavaScript面试技巧》学习笔记（10）-页面
DOMContentLoaded 与onload区别以及使用
window.onload document.onDOMCont
面试笔记
从官网文档，看window.onload，document.on
【浏览器】什么是CRP
onload、load()、ready()事件和DOMConte

1、load事件触发时，页面上所有的DOM，样式表，脚本，图片都已经加载完成了.

window.onload = function() {
    var span = document.querySelector("span");
    console.log(span,"onload");
};

2、DOMContentLoaded事件触发时，仅当DOM加载完成，不包括样式表，图片(譬如如果有async加载的脚本就不一定完成)

document.addEventListener("DOMConetentLoaded", function() {
    var span = document.querySelector("span");
    console.log(span, "DOMConetentLoaded");
});

当加载的脚本内容并不包含立即执行DOM操作时，使用onDOMContentLoaded事件是个更好的选择，会比onload事件执行时间更早。

网友评论

本文标题：onload、DOMContentLoaded区别

本文链接：https://www.haomeiwen.com/subject/tnslprtx.html

延伸阅读

深度阅读

您也可以注册成为美文阅读网的作者，发表您的原创作品、分享您的心情！

onload、DOMContentLoaded区别

相关文章

window.onload 和 DOMContentLoaded

js复习

运行环境—页面加载和渲染过程

慕课网《前端JavaScript面试技巧》学习笔记（10）-页面

DOMContentLoaded 与onload区别以及使用

window.onload document.onDOMCont

面试笔记

从官网文档，看window.onload，document.on

【浏览器】什么是CRP

onload、load()、ready()事件和DOMConte

网友评论

延伸阅读

深度阅读

栏目导航

热点阅读