English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
使用jQuery,我们可以轻松地从DOM元素列表中过滤掉各种元素。
在本章中,我们将说明如何缩小对DOM树中元素的搜索范围。
我们有以下jQuery方法,用于根据特定元素在一组元素中的位置来选择它们:
下面将向您展示如何使用每种方法。
。 first()方法返回所选元素的第一个元素。
以下示例突出显示了第一段:
예제 $("p").first().css("background", "coral"); $("p").parent().is("div");});/테스트 보기‹
。 last()方法返回所选元素的最后一个元素。
以下示例突出显示了最后一段:
예제 $("p").last().css("background", "coral"); $("p").parent().is("div");});/테스트 보기‹
。 eq()方法返回具有选定元素的特定索引号的元素。
索引号始终从0开始,因此第一个数字将具有索引0(而不是1)。
下面的示例选择第三段(索引号2):
$("button").click(function(){ $("p").eq(2).css("background-color", "red"); $("p").parent().is("div");});/테스트 보기‹
。 filter()方法返回与特定条件匹配的元素。
此方法过滤掉所有不符合所选条件的元素,并且将返回那些匹配项。
下面的示例返回所有类名为“ demo”的段落:
예제 $("p").filter(".demo").css("background", "coral"); $("p").parent().is("div");});/테스트 보기‹
下面的示例返回所有偶数列表项:
예제 $("li").filter(":even").css("background", "coral"); $("p").parent().is("div");});/테스트 보기‹
。 not()方法返回不符合特定条件的元素。
此方法与该filter()方法相反。
下面的示例返回所有不具有类名称“ demo”的段落:
예제 $("p").not(".demo").css("background", "coral"); $("p").parent().is("div");});/테스트 보기‹
。 jQuery has() 메서드has()
메서드는 지정된 선택자와 일치하는 모든 요소를 반환합니다. 이 중 하나 이상의 요소가 포함될 수 있습니다。
예제 아래의 예제는 <span> 요소를 포함한 모든段落을 반환합니다:-$("p").has("span").css("background $("p").parent().is("div");});/테스트 보기‹
。 jQuery is() 메서드is()
메서드는 선택된 요소 중 하나가 주어진 매개변수와 일치하는지 확인합니다。
이 메서드는 최소한 하나의 요소가 주어진 매개변수와 일치하면 true를 반환하고, 그렇지 않으면 false를 반환합니다。
예제 $("document").ready(function(){ $("p").parent().is("div");});/테스트 보기‹
›완전한 탐색 메서드에 대한 자세한 정보는 우리의jQuery 탐색 참조