jQuery入门

一，概述

1.JavaScript库

是一个封装好的待定集合，封装了很多函数在里面

2.概念

加快前端人员开发速度，可以非常快捷的调用它

二，基本使用

先把代码引入进来，在进行后续的操作

1.入口函数

2.顶级对象$

$是jQuery的别称

还是顶级对象，可以使用$把元素包装成jQuary对象，可以调用某种方法

3.jQuery对象和DoM对象

DOM对象：用原生JavaScript获取的对象。只能使用原生的JavaScript的属性和方法

var input=document.querySelector（‘div’）

这个input就是DOM对象

jQuery对象：用jquery获取的对象，即$对DOM对象进行包装的jQuery的对象（伪数组方式进行存储），只能使用jquery方法

相互转换

如果前面已经声明了一个DOM对象，则在转换为jQuery是就不用加引号了

三，常用API

1.选择器

获取元素的方法：$（“选择器”），里面直接填css选择器即可，不要忘记加引号

1.隐式迭代

jQuery的样式设置：

$("div").css('属性'，‘值’)

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

2.筛选选择器

3.筛选方法

find会把子孙后代都选择出来

4.排他思想

有了隐式迭代，就省略了遍历过程，把其他兄弟的样式删除，就可以实现多选一的效果

5.链式编程

2.样式操作

1.操作css方法

2.类样式方法

3.效果

1.显示与隐藏

2.事件切换

3.动画队列及停止排队的方法

必须写在动画前面

4，淡入淡出效果

fadeIn是淡入效果，  fadeToggle()是淡入淡出相切换

 5.自定义动画

4.属性操作

1.获取固有属性prop()

2.获取固有属性attr()

3.数据缓存data（）

里面的数据是存放在数据的内存里面的

5.内容文本值

修改表单里面的值用val（）方法

第一个方法还会获取标签，而第二个只会获取内容

6.元素操作

1.遍历函数

方便处理数据的

2.创建元素

3.添加元素

1.内部添加

父子关系

用perpend是内部添加，把内容放入元素的最前面

2.外部添加

兄弟关系

4.删除元素

第一个不仅内容没了，标签也没了

第二个和第三个删除内容，但是标签还在

7.尺寸位置操作

1.尺寸

2.位置

1.offset（）设置或获取元素偏移

  获取设置距离文档的位置

以文档为主和父级没有关系

 

上面是获取，下面是修改

2.position （）

获取带有距离定位的父级位置，若没有带定位的父级盒子，那就以文档为主

只能获取不能设置

3.scrollTop（）/scrollLeft（）设置或获取元素被卷取的头部和左侧

 

四，事件问题

1.事件注册

1.单个事件注册

2.绑定on事件

3，解绑

4.自动触发事件

第三种不会触发元素的默认行为

2.事件对象

1.对象拷贝

会覆盖原来的数据

复制的是复杂数据类型的地址而不是数据，若原数据变化，则复制后的也会变化