jquery 学习速成笔记

子节点过滤器：

1. :nth-child(index/even/odd/equation)
   匹配元素是它们父亲元素的第n个子节点、或者是奇数偶数节点。

2. :first-child
   作为第一个子节点的元素。

3. :last-child
   作为最后一个子节点的元素。

4. :only-child
   作为唯一的子节点的元素。

表单选择器：

1. :input
   匹配input, textarea, select 以及button 元素。

2. :text

3. :password

4. :radio

5. :checkbox

6. :submit

7. :image

8. :reset

9. :button

10. :file

11. :hidden
    匹配不可见的元素以及input hidden

表单过滤器：

1. :enabled

2. :disabled

3. :checked

4. :selected

管理选择结果

访问结果长度

$(''p'').size()

size方法

获取某个元素

$(''p'')[0]

$(''p'').get(0)

将结果转换为数组

get方法如果没有参数就会将

var arr = $(''p'').get()

取得当前节点的索引

$(''#foo'').index($(''div''))

取得id为foo的div在所有div内的索引。

向结果中添加元素

$(''p'').add(''a'').fadeOut().fadeIn();

和$(''p,a'').fadeOut().fadeIn();是完全等同的。

从结果中删除元素

$(''div'').not(''#foo'').fadeOut().fadeIn();

从$(''div'')中去掉''#foo''。

注意not不再接受标签。不能写not(''div#foo'')

从结果中过滤元素

$(''div'').filter(''#foo'').fadeOut().fadeIn();

从div中再过滤一遍id等于foo的。再如：

$(''p'').filter(''[title]'').fadeOut().fadeIn();

filter与not一样不再接受标签，而且过滤的时候没有=只有^=、*=、$=。filter中也可以使用函数过滤器，返回true的选中。

$(''div'').filter(function(){ return true})

极端情况：

$(''div'').filter(function(){ return false}).fadeOut().fadeIn();

一个也不选中。

$(''div'').filter(function(){ return true}).fadeOut().fadeIn();

全部选中。

在结果范围内寻找元素

$(''ul'').find(''a'').fadeOut().fadeIn();

在ul的范围内再寻找a。

jQuery链

end方法

返回上一层操作的元素。

$(''div'').find(''a'').end().fadeOut().fadeIn();

end又回到了$(''div'')。

andSelf方法

$(''div'').find(''a'').andSelf().fadeOut().fadeIn();

包含$(''div'')以及.find(''a'')的结果。

操作元素

each方法

each方法可以遍历所有的选中的元素，并且使用一个函数来对其进行操作。

$(''p'').each(function(index){$(this).prepend(index+''.'')});

选中所有的p，并且在前面加上索引号。

属性

使用attr访问和设置元素的属性。

var test = $(''p[title]'').attr(''title'');

获得了title属性的值。当传递两个参数的时候可以设置属性。

$(''p[title]'').attr(''title'',''jQuery'');

将title属性设置为''jQuery''。

$(''a[href^=http://]'').attr(''target'',''_blank'');

外部链接在新窗口打开。

removeAttr删除属性

$(''p[title]'').removeAttr(''title'');

删除了title属性。

CSS样式

直接使用css来设置CSS属性。

$(''p'').css(''color'',''green'')

addClass添加类名。

removeClass删除类名。

toggleClass切换类名。

元素内容

html()访问innerHTML

html(content)设置innerHTML

text()访问文本。

text(content)设置文本。

书上的例子，非