1、jQuery概述、基本使用-CFANZ编程社区

jQuery是一个快速、简洁的JavaScript库，其设计的宗旨是“write Less, Do More”，即倡导写更少的代码做更多的事情。j就是JavaScript；Qurey查询；意思就是查询js，把js中的DOM操作做了封装，我们可以快速的查询使用里面的功能。

jQuery封装了JavaScript常用的功能代码，优化了DOM操作、是事件处理、动画设计和Ajax交互。学习jQuery的本质：就是学习调用这些函数（方法）。

基本使用

jQuery官网：jQuery

选择生产环节版本（压缩版），将里面代码复制粘贴到新建.min.js文件，就可以引入使用了。

<script src="jQuery.min.js"></script>

验证其引入成功。

   <style type="text/css">
     div {
         width: 100px;
         height: 100px;
         background-color: pink;
     }
    </style>
</head>
<body>
    <div></div>
    <script>
        $('div').hide();//将div盒子隐藏起来。
    </script>
</body>

入口函数

相当于原生js中的 DOMContentLoaded

 <script>
        //1、等待页面的DOM加载完毕就去执行js代码
        $(document).ready(function() {
            $('div').hide();
        })
        //2、简洁的第二种方法
        $(function(){
            $('div').hide();
        })
    </script>
    <div></div>

jQuery的顶级对象$

$是jQuery的别称，在代码中可以使用 jQuery 代替 $ ，但$简洁方便，推荐使用。

$是jQuery的顶级对象，相当于原生js中的window。把元素利用$包装成jQuery对象，就可以调用jQuery的方法。

jQuery对象和DOM对象

利用原生js获取过来的对象就是DOM对象
jQuery对象：利用jQuery方式获取过来的对象就是jQuery对象，本质：通过$把DOM元素进行了包装，产生的新的对象（伪数组形式存储）。
jQuery对象只能使用jQuery方法，DOM对象则使用原生的JavaScript属性方法。不能混用

 $('div');

window.addEventListener('load',function(){
        var myDiv = document.querySelector('div');
        console.dir(myDiv);
       
       })
            //注意查看两者的区别
        $(function(){
            $('div');
            console.dir($('div'));
        })

两者是可以相互转换的，需要时可能jQuery不具备js的某些属性方法

DOM对象转化为jQuery对象

 var myDiv = document.querySelector('div');
        $(myDiv);

$(DOM对象);

jQuery对象转化为DOM对象（两种方法）
```
$('video')[0].play();
```
$（'div'）[index] index是索引号

$('div').get(index) index是索引号

嘿嘿，学习快乐！