jQuery 遍历过滤方法
first(), last(), eq(), filter() 和 not() 方法
最基本的过滤方法是 first(), last() 与 eq()，它们让您可以根据特定元素在一组元素中的位置来选择特定元素。
其他筛选方法，如 filter() 和 not()，让您可以选择与特定条件匹配或不匹配的元素。
jQuery first() 方法
first() 方法返回指定元素中的第一个元素。
下面的实例选择第一个 <div> 元素:
实例
<!DOCTYPE html><html><head><script src="https://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script><script>$(document).ready(function(){$("div").first().css("background-color", "yellow");});</script></head><body><h2>Welcome to My Homepage</h2><p>This is a paragraph.</p><div style="border: 1px solid black;"><p>A paragraph in a div.</p><p>Another paragraph in a div.</p></div><br><div style="border: 1px solid black;"><p>A paragraph in another div.</p><p>Another paragraph in another div.</p></div><br><div style="border: 1px solid black;"><p>A paragraph in another div.</p><p>Another paragraph in another div.</p></div></body></html>
jQuery last() 方法
last() 方法返回指定元素中的最后一个元素。
下面的实例选择最后一个 <div> 元素:
实例
<!DOCTYPE html><html><head><script src="https://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script><script>$(document).ready(function(){$("div").last().css("background-color", "yellow");});</script></head><body><h2>Welcome to My Homepage</h2><p>This is a paragraph.</p><div style="border: 1px solid black;"><p>A paragraph in a div.</p><p>Another paragraph in a div.</p></div><br><div style="border: 1px solid black;"><p>A paragraph in another div.</p><p>Another paragraph in another div.</p></div><br><div style="border: 1px solid black;"><p>A paragraph in another div.</p><p>Another paragraph in another div.</p></div></body></html>
jQuery eq() 方法
eq() 方法返回具有选定元素的指定索引号的元素。
索引号从 0 开始，因此第一个元素的索引号为 0，而不是 1。以下示例选择第二个 <p> 元素（索引是 1）:
实例
<!DOCTYPE html><html><head><script src="https://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script><script>$(document).ready(function(){$("p").eq(1).css("background-color", "yellow");});</script></head><body><h2>Welcome to My Homepage</h2><p>My name is Donald (index 0).</p><p>Donald Duck (index 1).</p><p>I live in Duckburg (index 2).</p><p>My best friend is Mickey (index 3).</p></body></html>
jQuery filter() 方法
filter() 方法用于指定条件。不符合条件的元素将从选择中删除，而符合条件的元素将被返回。
下面的实例返回所有的 class 名称为 "intro" 的 <p> 元素:
实例
<!DOCTYPE html><html><head><script src="https://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script><script>$(document).ready(function(){$("p").filter(".intro").css("background-color", "yellow");});</script></head><body><h2>Welcome to My Homepage</h2><p>My name is Donald.</p><p class="intro">I live in Duckburg.</p><p class="intro">I love Duckburg.</p><p>My best friend is Mickey.</p></body></html>
jQuery not() 方法
not() 方法返回与条件不匹配的所有元素。
提示: not() 方法与 filter() 方法相反
下面的实例返回所有不存在 class 名称为 "intro" 的 <p> 元素:
实例
<!DOCTYPE html><html><head><script src="https://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script><script>$(document).ready(function(){$("p").not(".intro").css("background-color", "yellow");});</script></head><body><h2>Welcome to My Homepage</h2><p>My name is Donald.</p><p class="intro">I live in Duckburg.</p><p class="intro">I love Duckburg.</p><p>My best friend is Mickey.</p></body></html>
jQuery 遍历参考
有关所有 jQuery 遍历方法的完整概述，请访问本站的 jQuery 遍历参考。