https://blog.csdn.net/qq_34802511/article/details/82589487
一、DOM加載過程
網頁文檔加載都是按順序執行的。一般浏覽器渲染操作順序大緻是一下幾個步驟：
1.解析HTML結構
2.加載外部腳本和樣式表檔案
3.解析并執行腳本代碼
4.構造HTML DOM模型
5.加載圖檔等外部檔案
6.頁面加載完畢
一、$(document).ready(function()
$ (function() {}) 是$(document).ready(function()的簡寫，兩者效果一樣。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="/common/js/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function() {
console.log("1");
});
$(function(){
console.log("2");
$(function(){
console.log("3");
$(function(){
console.log("4");
});
});
});
$(document).ready(function() {
console.log("5");
$(function(){
console.log("6");
});
});
$(function(){
console.log("7");
$(document).ready(function() {
console.log("8");
});
});
</script>
<body>
執行順序1，2，5，7，3，6，8，4
$(document).ready(function() {}和$(function(){}） 是 一摸一樣的，
誰在前面誰在先執行，還有多個閉包函數時 按成次 一級一級運作的。
</body>
</html>
$(function() {}) 是什麼時候執行的呢？
答案： DOM加載完畢之後執行。
DOM是什麼？
DOM就是一個html頁面的标簽樹，樹，樹。
那麼什麼時候，DOM加載完成了呢？即頁面所有的html标簽（包括圖檔等）都加載完了，即浏覽器已經響應完了，加載完了，全部展現到浏覽器界面上了。
三、window.onload
window.onload = function(){//執行腳本}
等頁面加載完後在執行（包括js和dom），也可以了解為所有dom文檔和所有檔案都加載完後執行。
總結：
DOM在第一次頁面加載完畢後，就在記憶體裡了，無論後面怎麼通過ajax的方式去局部修改html頁面，都隻是對記憶體中的DOM樹進行修改，而DOM在第一次頁面加載完畢後就已經加載完畢了。是以後面js檔案（動态加載或者head中加載）再使用到$(function() {})函數肯定會執行的。
$(function() {})比window.onload先執行
參考
1.如何在DOM元素加載完畢後執行js代碼以及DOM加載過程
2.$(document).ready(function()和 $(function()執行順序
![主流浏覽器四大綜合性能測試[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)