示例一
先來康個栗子
代碼一
註釋部分爲特別關注
<body>
<img src="../program1/images/1.jpg" >
</body>
<script src="../jquery.js"></script>
<script>
<body>
<img src="../program1/images/1.jpg" >
</body>
<script src="../jquery.js"></script>
<script>
window.onload = function() {
//1、通過原生JS入口函數可以拿到DOM元素
var img = document.getElementsByTagName("img")[0];
console.log(img);
//2、通過原生JS入口函數可以拿到DOM元素寬高
var width = img.style.width;
console.log("原生JS "+width);
}
$(document).ready(function(){
//1、通過jQuery入口函數可以拿到DOM元素
var $img = $("img")[0];
console.log($img);
//2、通過jQuery入口函數不可以拿到DOM元素寬高
var $width = $img.width;
console.log("jQuery "+$width);
});
</script>
示例二
再來康個栗子
代碼二
註釋部分爲特別關注
<script src="../jquery.js"></script>
<script>
//原生JS如果編寫多個入口函數，後面編寫的會覆蓋前面編寫的
window.onload = function(){
alert("我是第一個");
};
window.onload = function(){
alert("我是第二個");
};
</script>
<script>
//jQuery中編寫了多個入口函數，後面的不會覆蓋前面的
$(document).ready(function(){
alert("我是第一個");
});
$(document).ready(function(){
alert("我是第二個");
});
</script>
總結
（1）通過原生JS入口函數和jQuery入口函數都可以拿到DOM元素
（2）通過原生JS入口函數可以拿到DOM元素寬高，但通過jQuery入口函數不可以拿到DOM元素寬高
（3）原生JS如果編寫多個入口函數，後面編寫的會覆蓋前面編寫的。而jQuery中編寫了多個入口函數，後面的不會覆蓋前面的
（4）原生JS和jQuery入口函數的加載模式不同。原生JS會等到DOM元素加載完畢，並且圖片加載完畢之後纔會執行。 jQuery會等到DOM元素加載完畢，但不會等到圖片也加載完畢就會執行