onload事件和domcontentloaded哪个先执行呢？

在前端开发中，关于onload事件和DOMContentLoaded事件的执行顺序，可以明确地回答：DOMContentLoaded事件先于onload事件执行。

1. 事件定义与触发时机：

   • DOMContentLoaded事件：当HTML文档被完全加载和解析完成后触发，不等待样式表、图像和子框架的完成加载。
   • onload事件：当整个页面及所有依赖资源如样式表和图片完成加载后触发。

2. 执行顺序：

   • 在页面加载过程中，首先解析HTML结构。
   • 接着加载外部脚本和样式表文件。
   • 解析并执行脚本代码。
   • DOM树构建完成后，DOMContentLoaded事件被触发。
   • 继续加载图片等外部文件。
   • 当所有资源都加载完毕后，onload事件被触发。

3. 实际应用中的考虑：

   • 由于DOMContentLoaded事件触发较早，通常用于在DOM加载完成后立即执行的操作，如绑定事件处理器、初始化接口等，而不必等待图片等外部资源加载完成。
   • onload事件则适用于那些需要等待所有资源加载完成后才能执行的操作，如读取图片宽度和高度等。

4. 兼容性与写法：

   • 现代浏览器普遍支持DOMContentLoaded和onload事件。
   • 在JavaScript中，可以使用document.addEventListener方法来监听这两个事件。
   • jQuery库提供了简化的方法：$(document).ready()对应DOMContentLoaded，而$(window).on('load', function() {})对应onload。

综上所述，DOMContentLoaded事件总是在onload事件之前执行，因为它们分别标志着DOM加载完成和所有资源加载完成的两个不同阶段。