示例一
先来康个栗子
代码一
注释部分为特别关注
<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元素加载完毕，但不会等到图片也加载完毕就会执行
