标题有点长了，但是就是我本篇文章要讲的内容，因为我发现许多朋友，当然了也包含我自己，会对这一大堆，乱七八糟的写法，给搞蒙了，所以我觉得我自己有必要重新梳理下，巩固下。
先说下，JavaScript中DOMContentLoaded与onload。
DOMContentLoaded：当初始的 HTML 文档被完全加载和解析完成之后，DOMContentLoaded 事件被触发，而无需等待样式表、图像和子框架的完全加载。
load：当整个页面及所有依赖资源如样式表和图片都已完成加载时，将触发load事件。它与DOMContentLoaded不同，后者只要页面DOM加载完成就触发，无需等待依赖资源的加载。
所以，来个代码实例吧，一目了然。
document.addEventListener("DOMContentLoaded", function () {
console.log("DOMContentLoaded回调");
});
//监听load事件，有两种写法addEventListener和onload
//写法一
window.addEventListener("load", function () {
console.log("load事件回调——写法一");
});
//写法二
window.onload = function () {
console.log("load事件回调——写法二");
};
// 输出结果顺序为：
// DOMContentLoaded回调
// load事件回调——写法一
// load事件回调——写法二
原生的JavaScript讲完了，那就要说下关于jQuery中ready和load的区别了。
而实际上jQuery中ready和load的区别，也就是原生JavaScript中的DOMContentLoaded与load区别，因为JQuery中的这两个方法底层就是用原先写的。
而JQuery做的事情就有简化写法（具体的可以看下面的代码就是知道代码量少了多少），并处理兼容性的问题，这对于之前没有还没数据驱动这个概念的时候，JQuery在前端的位置就是number one，无可替代的，所以JQuery存在是有道理的，一个时代一代人把，尤其在技术变化飞快的现在，不是说不用JQuery了，而是用的少了，至少我这边接触到都是用Vue框架，React库任务。
随后我想了想，目前我用JQuery的场景，好像大部分都是在自己的站点，当然了为了不拉下现在的技术，我也是能用框架还是用框架的呢，毕竟快，准，狠，哈哈哈。
对了，来感受下关于jQuery中ready和load写法吧。
//DOMContentLoaded
$(document).ready(function () {
console.log("reday");
});
//load
$(document).load(function () {
console.log("load");
});
// 输出结果顺序：
// ready
// load