在JavaScript中常見的入口函數寫法如下：
window.onload = function(){
// content
}
我們可以通過文檔加載完成事件.ready()函數做入口函數：
$(document).ready(function(){
// content
})
當然jQuery也給出了與其等價的幾種辦法：
$(document).ready(handler)
$().ready(handler) (不建議使用)
$(handler)
當然我們也可使用類似於JavaScript中的addEventListener()的.bind()函數實現（$(document).bind("ready", handler)）,不過這種方法已經在jQuery1.8 中不建議使用，雖然這種方法和ready()相似，但是如果ready()執行了，再使用.bind("ready")的話，.bind("ready")將會在以上幾種情況執行完成後在執行，也就是同時出現.ready()和.bind("ready")，將會優先執行.ready()。
挖坑：
.ready()方法方法只能被匹配當前文檔的 jQuery 對象調用，因此選擇符可能被省略。沒有看懂
當我們同時使用其他JavaScript庫的時候，我們可以使用$.noConflict()來避免出現命名空間的混淆，這個時候$()快捷方式將不能使用，只能使用jQuery()來代替$()，這個時候我們我們就會使用jQuery(document).ready(handler)和jQuery(handler)來作爲入口函數。
值得注意的是.ready()方法通常和屬性是不兼容的。如果必須使用，要麼不使用.ready()，要麼使用jQuery的.load()方法向 window 或一些指定的元素（例如，圖片）綁定 load 事件。
還需要注意的是，在JavaScript中的window.onload是在所有DOM和一些指定元素加載完成後執行的，但是在jQuery中.ready()在DOM加載完成就會執行代碼，一些特殊的代碼（如獲取圖片大小），可以放到.load()中，如：
$(window).load(function () {
// run code
});
在原生JavaScript中後寫的入口函數會覆蓋之前的入口函數，而在Query中不會覆蓋，而是追加在原有的函數後。
代碼：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>入口函數</title>
<script src="https://upcdn.b0.upaiyun.com/libs/jquery/jquery-2.0.2.min.js"></script>
</head>
<body>
<img src="https://source.unsplash.com/30x40/?book,library" alt="" id="img">
</body>
<script>
window.onload = function () {
console.log("window.onload:入口函數");
}
window.onload = function () {
var wight = $("#img").width();
console.log("window.onload:" + wight);
}
$(document).ready(function () {
console.log("$(document).ready():入口函數");
})
$(function () {
// 通過$(function(){})不能獲取圖片高度
var wight = $("#img").width();
console.log("$():" + wight);
})
$(document).ready(function () {
// 通過$(window).load(function(){})可以獲取圖片高度
var wight1 = $("#img").width();
console.log("$(document).ready():" + wight1);
})
$(window).load(function () {
// 通過$(window).load(function(){})可以獲取圖片高度
var wight2 = $("#img").width();
console.log("$(window).load():" + wight2);
})
</script>
</html>