jquery 学习整理

jquery选择器

1、基本选择器

* 匹配任何元素

E 匹配E元素

E F 匹配F元素，作为E的后代元素

2、位置选择器

:first 匹配最先的元素

:last 匹配最后的元素

:first-child 匹配最先的子元素

:last-child 匹配最后的子元素

:even(odd) 匹配页面中偶数或奇数的元素

:eq(n) 匹配第n个元素

:lt(n) 匹配第n个元素之前的元素，不包括n

:gt(n) 匹配第n个元素之后的元素，不包括n

 

管理包装元素集合

1、size() 返回包装集里面元素的个数。可以通过get(index)来获取某个元素，下标从0开始

get(index)获取的对象为js对象，不能直接当jquery对象操作，需要通过$()转换，如果get()

不加参数则获取的是整个数组对象。也可以通过[index]来获取

2、index() 在包装集里面查找某个元素的下标，不常用

 

筛选元素包装集

1、add() 添加更多的元素至包装集，与","的效果一样

2、not() 删除包装集里面的元素，与add()方法相反

3、filter() 从包装集里面筛选元素，过滤掉元素，在包装集上操作，只针对当前包装集有用

不能过滤包装里面的元素，如需要过滤里面的元素则使用find()方法

4、find() 从包装集里面找元素，针对包装集里面的元素过滤，返回新包装集

5、slice(begin,end) 创建并返回新的包装集

 

利用关系获取包装集

1、children() 返回子元素组成的包装集合

2、contents() 内容的包装集合

3、next() 唯一的下一个兄弟所组成的包装集合

4、nextAll() 所有下一个兄弟组成的集合

5、parent() 唯一的直接父元素所组成的包装集合

6、parents() 所有同类父元素所级成的集合

7、prev() 唯一的上一个兄弟所组成的包装集合

8、prevAll() 所有上一个兄弟所组成的包装集合

9、siblings() 唯一兄弟元素组成的包装集合

10、is() 确定包装里面是否有相应的元素

 

管理jquery链

1、end() 返回前一个包装集

2、andSelf() 合并链内最近产生的两个包装集

 

操作元素属性和特性

1、each() 遍历包装里面的元素

2、attr(name) 获取属性

3、attr(name,value) 设置属性

4、removeAttr(name) 删除属性

5、addClass(names) 添加类名称

6、removeClass(names) 删除类名称

7、toggleClass(name) 切换类名称，用于切换样式

8、css(name,value) 设置样式

9、css(name) 获取样式

10、width(value) hight(value) 设置元素的宽度和高度

11、hasClass(name) 确定匹配的元素里面是否有name类名称

12、html() 匹配元素的html内容 html(text)设置元素的html

13、text() 返回包装集里面的文本内容 text(content)设置文本内容

14、append(content) 将内容添加至元素的末尾

15、appendTo(content) 将包装里面的元素移动至指定目标内容的末尾

16、prepend(content) prependTo(content) 在元素之前插入内容

17、remove() 删除元素

18、empty() 清空内容

19、clone() 克隆元素 克隆之后一般使用append()命令加入到一个新的元素中

20、val() 表单元素的value

21、data() 为元素添加属性数据，不会根据属性的方式显示在页面上

 

事件

1、bind(eventType,data,listener) 绑定事件

2、unbind(eventType,data,listener) 取消绑定事件

3、one(eventType,data,listener) 一次性事件绑定，执行完之后就删除了。

4、event.stopPropagation() 防止事件冒泡  

5、toggle(listenerOdd,listenerEven) click事件相互切换

6、hover(over,out) 悬停事件,替代mouseover mouseout或mouseenter mouseleave

7、live()可以为动态添加的元素绑定事件，但不太建议使用，1.6建议用delegate()方法,1.7建议使用on()

 

动画

1、show() 显示

2、hide() 隐藏

3、fadeOut() 浅出

4、fadeIn() 浅入

5、slideDown() 滑上

6、slideUp() 滑下

 

函数

1、$.browser 检测浏览器

2、$.trim(value) 去掉字符串起始和结尾的空格

3、$.grep(array, callback, [invert]) 过滤数组元素

4、$.map(array, callback) 数组中的元素转换到另一个数组中

5、$.extend(target, source1,source2...); 源对象的属性传入目标对象中并返回，可以设置对象的参数