小枫学习教育集团

IntroductionjQuery选择器选择出来的结果很多时候是一个DOM元素集而非单个元素，jQuery可以灵活的访问和修改DOM元素集，但是所谓的灵活是需要大量的函数的。由于篇幅和排版问题，本文的demo只是示意用法，完整的用法还请参考在线文档。

从DOM集合中选择元素get([index])获取DOM元素集中一个或者多个匹配元素，如：

1var ret = $('h3').get(0);

index([element])和get()相反，index()将获取元素在元素集中的序号，如：

1var ret = $('#content').index($('h3'));

将选取h3集合中的第一个元素。

first()获取DOM元素集中第一个元素，如：

1var ret = $('h3').first();

或者

1var ret = $('h3:first');

last()获取DOM元素集中最后一个元素，如：

1var ret = $('h3').last();

或者

1var ret = $('h3:last');

toArray()将获取的DOM元素集转换成数组，如：

1var ret = $('h3').toArray();

根据相对关系选择元素children([selector])获取DOM元素集中，符合选择器条件的子元素集，如：

1var ret = $('#context').children($('h3'));

parent([selector])和children()相反，获取DOM元素集中，符合选择器条件的父元素集，如：

1var ret = $('h3').parent($('#context'));

closest([selector])获取DOM元素集中，符合选择器条件的第一个父/祖先元素，如：

1var ret = $('#context').closest($('h3'));

contents()获取DOM元素集中的子元素，包含注释和文本，如：

1var ret = $('#context').contexts();

find([selector])获取DOM元素集中满足选择器条件的所有元素，如：

1var ret = $('#context').find($('h3'));

next([selector])获取DOM元素集中，当前元素后面的满足选择器条件的下一个元素，如：

1var ret = $('#context').next($('h3'));

prev([selector])和next()相反，获取DOM元素集中，当前元素前面的满足选择器条件的下一个元素，如：

1var ret = $('#context').prev($('h3'));

nextAll([selector])类似next()，获取DOM元素集中，当前元素后面的满足选择器条件的所有元素，如：

1var ret = $('#context').nextAll($('h3'));

prevAll([selector])类似prev()，获取DOM元素集中，当前元素前面的满足选择器条件的所有元素，如：

1var ret = $('#context').prevAll($('h3'));

nextUntil([selector])获取DOM元素集中，直到遇到选择器条件的元素之前的同辈元素，如：

1var ret = $('#context').nextUntil($('h3'));

prevUntil([selector])获取DOM元素集中，直到遇到选择器条件的元素之后的同辈元素，如：

1var ret = $('#context').prevUntil($('h3'));

siblings([selector])获取DOM元素集中，满足选择器条件的所有兄弟元素，如：

1var ret = $('#context').siblings($('h3'));

从next开始可能比较绕口，要真正理解其中的差别，需要在实际运用中加以理解。

Summary本文简要的列出了jQuery集合中筛选DOM元素的函数，列举只是表明常用的函数的范围，更多细节还请参考W3C的jQuery教程。

(本文出自csprojectedu.com，转载请注明出处)