jQuery和JS的加载模式

àì夳堔傛蜴生んèń 2022-03-15 15:42 175阅读 0赞

今天复习了一下jQuery，虽然课堂上讲过这个。但老师几乎都是照本宣科，听了跟没听一个X样。下面看代码吧，还是挺容易理解的。

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>03-jQuery和JS入口函数的区别</title>
        <script src="js/jquery.js"></script>
        <script> /* window.onload = function(ev){ //1.通过原生的JS入口函数可以拿到DOM元素 var img = document.getElementsByTagName("img")[0]; console.log(img); //2.通过原生的JS入口函数可以拿到DOM元素的宽高 var width = window.getComputedStyle(img).width; console.log(width); } */ /*1.原生JS和jQuery入口函数的加载模式不同 1).原生JS会等到DOM元素加载完毕后，并且图片也加载完毕后才会执行 2).jQuery会等到DOM元素加载完毕，但不会等到图片也加载完毕就会执行 */ /* $(document).ready(function(){ //1.通过jQuery的入口函数可以拿到DOM元素 var $img = $("img")[0]; console.log($img); //2.通过jQuery的入口函数可以拿到DOM元素的宽高 var $width = $img.width; console.log($width); }); */ /* 2. 1).原生JS如果编写了多个入口函数，后面编写的会覆盖前面编写的 2).jQuery中编写多个入口函数，后面的不会覆盖前面的 */ /*window.onload = function(ev){ alert("hello 1"); } window.onload = function(ev){ alert("hello 2"); }*/ $(document).ready(function(){ alert("hello 123"); }); $(document).ready(function(){ alert("hello 456"); }); </script>
    </head>
    <body>
        <img src="https://misc.360buyimg.com/mtd/pc/common/img/no_login.jpg" alt="" >
    </body>
    </html>

应该是有点小问题的，不过上述的两点不同是没有问题的。大家若有任何疑问或是不解，请在下方评论，谢谢。