JQuery主要知识点总结

1、jQuery概述

1.1Javascript库

JavaScript库：即library，是一个封装好的特定的集合（方法和函数），从封装一大堆函数的角度理解库，就是在这个库中，封装了许多预先定义好的函数在里边。

简单理解就是一个js文件，里面对原生的代码进行了封装，这样就可以快速高效的使用这些封装好的功能。

1.2、JQuery的概念

jQuery是一个快速、简洁的JavaScript库，把js里的DOM操作做了封装，我们可以快速的查询使用里面的功能。

2、jQuery的基本使用

2.1、jQuery的入口函数

$(document).ready(function(){
   
            $('div').hide();
})
$(function(){
   
            $('div').hide();
})

2.2、jQuery的顶级对象$

$是jQuery对的别称，同时也是jQuery的顶级对象

jQuery(function(){
   
    alert("jQuery");
});
$(function(){
   
    alert("dollar")
});

2.3、jQuery对象和DOM对象

1、用原生js引用过来的对象就是原生对象

2、用jQuery放法获取的元素就是jQuery对象

3、jQuery对象的本质：利用$对DOM对象包装后产生的对象（伪数组形式储存 ）

var Div = document.querySelector('div');//Div是DOM对象

$('div');//$('div')是一个jQuery对象

jQuery对象只能使用jQuery方法，DOM对象则使用原生的JavaScript属性和方法

DOM对象和jQuery对象是可以相互转换的，因为原生js比jQuery更大，原生的一些属性和方法， jQuery没有给我们封装，要想使用这些属性方法必须将jQuery对象转换为DOM对象才能使用。

1、DOM对象转化为jQuery对象：$(DOM对象)

2、jQuery转化为DOM对象：(1)$（DOM对象）[index](2)$（DOM对象).get(index) index是索引号

3、jQuery选择器

3.1、基础选择器

$（“选择器”）

隐式迭代 就是把匹配到的所有的元素内部进行遍历循环，给每一个元素都添加这个方法

3.2、jQuery的筛选选择器

 <ul>
        <li>first</li>
        <li>seccend</li>
        <li>last</li>
    </ul>
    <script>
        $(function(){
    
            $("ul li:first").css("color","red");
        })//将第一个li变为红色
    </script>

3.3、jQuery筛选的方法

 <div class="grandfather">
            <div class="father">father</div>
            <div><div class="son">son</div></div>
            <p>paragraphs</p>
        </div>
        <script>
            $(function(){
    
                 console.log($("div").parent());
                 $(".grandfather").children("p").css("color","red")
            })//其他的方法使用方法都差不多，不一一列举
        </script>

3.4、jQuery的样式操作

jQuery可以使用css方法来修改元素样式；也可以操作类，修改多个样式

1、参数只写属性名，则是返回属性值

$(this).css("color");

2、参数是属性名、属性值、逗号分隔，是设置一组样式，属性必须加引号，值如果是数字可以不用跟单位和引号

$(this).css("color","red)

3、参数可以是对象形式，方便设置多组样式，属性名属性值用冒号隔开，属性可以不用加引号

$(