Jquery-01-认识

获取节点元素

原生js获取

            let button = document.getElementsByTagName("button");
            console.log(button);
            let div = document.getElementsByTagName("div");
            console.log(div);

jQuery获取

  			let $button = $("button");
            let $div1 = $("div");
            console.log($button);
            console.log($div);

二者区别

内容一样，但是名称有些许不同

入口函数

原生js

		  //原生 js 的入口函数。页面上所有内容加载完毕，才执行。
        //不仅要等文本加载完毕，而且要等图片也要加载完毕，才执行函数。
       window.onload = function () {
           alert(1);
       }

JQuery

仅仅文档加载完毕

	//文档加载完毕，图片不加载的时候，就可以执行这个函数。
       $(document).ready(function () {
           alert(1);
       })

简写：

   $(function () {
            alert(1);
        });

文档图片都加载完毕

     //文档加载完毕，图片也加载完毕的时候，在执行这个函数。
       $(window).ready(function () {
           alert(1);
       })

二者区别

		 $(document).ready(function () {
            alert("document")
        });

        $(window).ready(function () {
            alert("window")
        });
        $(function () {
            alert("$");
        });

三个函数都执行，由于页面并没有图片资源，所以按顺序执行

        window.onload=function () {
            alert("1");
        }

        window.onload=function () {
            alert("10");
        }
        window.onload=function () {
            alert("100");
        }

三个函数仅仅执行最后一个
综上

• Js 的入口函数只能出现一次，出现多次会存在事件覆盖的问题。
• jQuery 的入口函数，可以出现任意多次，并不存在事件覆盖问题。
• Js的入口函数是在所有的文件资源加载完成后，才执行。这些文件资源包括：页面文档、外部的js文件、外部的css文件、图片等。
• jQuery的入口函数，是在文档加载完成后，就执行。文档加载完成指的是：DOM树加载完成后，就可以操作DOM了，不用等到所有的外部资源都加载完成。