JQuery

1、JQuery概念
　 是js的程序库，对js对象和函数进行封装，可以大幅提高开发效率

2、基本语法：

　  $(selector).action();

 

3、选择器：

　  1、基本选择器： 标签选择器、类选择器、ID选择器、并集选择器、交集选择器 

　  2、层次选择器： 后代选择器 空格 、子选择器 > 、相邻元素选择器 + 、同辈元素选择器 ~ 

　  3、属性选择器：  [attribute] 选取拥有给定属性的元素

　　　　　　　　　　[attribute=value] 选取给定属性是某个特定值的元素　　　　　　　　　

　　　　　　　　　　[attribute!=value]

　　　　　　　　　　[attribute^=value] 选取给定属性以特定值开头的元素

　　　　　　　　　　[attribute$=value] 选取给定属性以特定值结尾的元素

　　　　　　　　　　[attribute*=value] 选取给定属性包含特定值的元素

　　　　　　　　　　[a1][a2][a3] 选取同时满足多个条件的元素

　　4、过滤选择器： :first 、:last

　　　　　　　　　　:enve 、:odd 、:eq(index)、:gi(index)、:lt(index)  索引从0开始

 

4、事件

　　1、鼠标事件：

　　　　click( ) 触发或将函数绑定到指定元素的click事件 　　　　　　   单击鼠标时

　　　　mouseover( ) 触发或将函数绑定到指定元素的mouse over事件    鼠标移过时

　　　　mouseout( ) 触发或将函数绑定到指定元素的mouse out事件　　 鼠标移出时

　　2、键盘事件：

　　　　keydown( ) 触发或将函数绑定到指定元素的keydown事件 按下键盘时

　　　　keyup( ) 触发或将函数绑定到指定元素的keyup事件 释放按键时
　　3、表单事件：

　　　　focus( ) 触发或将函数绑定到指定元素的focus事件   获得焦点

　　　　blur( ) 触发或将函数绑定到指定元素的blur事件 　　 失去焦点

　　4、 鼠标悬停复合事件：

　　　　hover()方法相当于mouseover与mouseout事件的组合

　　5、 连续点击复合事件：

　　　　toggle()除了可以模拟鼠标的连续单击事件

 

5、元素显示效果

　　1、 改变元素的宽和高（带动画效果）：

　　　　show( speed )：显示

　　　　hide( speed )：隐藏

　　　　toggle( speed )等价于show+hide : 显示的隐藏，隐藏的显示

　　2、 改变元素的高（拉伸效果）：

　　　　slideDown( speed ) ：显示

　　　　slideUp( speed )：隐藏

　　　　slideToggle( speed )等价于slideDown+slideUp

　　3、不改变元素的大小（淡入淡出效果）

　　　　fadeIn( speed ) 显示

　　　　fadeOut( speed ) 隐藏

　　　　fadeToggle( speed ) 等价于fadeIn+fadeOut动画

　　　　fadeTo( speed , 透明度 ) 方法允许渐变为给定的不透明度（值介于 0 与 1 之间）

　　　　ps: 可选的 speed 参数规定隐藏/显示的速度，可以取以下值："slow"、"fast" 或毫秒

　　4、链操作：

　　　　链是允许我们在同一个元素上在一条语句中运行多个jQuery方法，可以把动作/方法链接在一起

 

6、DOM和CSS操作

　   1、 属性函数：

　　　　attr( "属性" ); 获得元素的属性值

　　　　attr( "属性" , "新值" ); 修改元素的属性值

　　　　attr( 样式参数 ) ：样式参数可以写成json格式

　　　　val() ; 获得表单元素中的value值

　　　　val("x") 修改表单元素中的value值

　　　　html(); 获得元素中的内容（标签+文本）

　　　　html("x") 修改元素中的内容（标签+文本）

　　　　text(); 获得元素中的文本

　　　　text("x") 修改元素中的文本

　　 2、样式函数：

　　　　css( "属性"); 获得该属性值

　　　　css( "属性","值"); 设置属性的值

　　　　css( { json} ); 设置多个属性的值

　　 3、类样式函数：

　　　　addClass(); 为元素添加类样式

　　　　removeClass(); 将元素的类样式移除

　　　　toggleClass(); 样式的切换（有->无，无->有）

　　 4、节点操作：

　　　　创建节点：$()

　　　　插入子节点：append()、appendTo()、prepend()、prependTo()

　　　　插入同辈节点：after()、insertAfter()、before()、insertBefore()

　　　　替换节点：replaceWith()、replaceAll()

　　　　复制节点：clone()

　　　　删除节点：remove() 删除整个节点、empty() 清空节点文本内容

 

7、遍历绩点：

　　　1、祖先元素：  parent()

　　　　　　　　　　parents() 所有祖先元素，可以传参选择某一辈
　　　2、同辈元素：  next()

　　　　　　　　　　 prev(）

　　　　　　　　　　 siblings() 同辈元素，可以传选择器

　　　3、后代元素：  children(
[selector]
)
　　　　　　　　　　 find(
selector
)

　　　4、元素的过滤： first()、last()、eq(index)、not()、is()返回布尔类型