jQuery 필터 메소드 filter() 사용에 대한 자세한 설명-JS 튜토리얼-php.cn

jQuery 필터 메소드 filter() 사용에 대한 자세한 설명

php中世界最好的语言

풀어 주다： 2018-04-24 11:52:18

원래의

3454명이 탐색했습니다.

이번에는 jQuery 필터링 방법인 filter() 사용에 대해 자세히 설명을 들고 왔습니다. jQuery 필터링 방법인 filter() 사용 시 주의사항은 무엇인가요?

이제 배경 이미지가 있는 모든 요소를 선택해야 합니다.

이 문제는 약간 까다롭습니다. 이 문제를 완료하기 위해 선택 표현식을 사용할 수 없습니다.
jQuery의 DOM 필터링 메소드인 filter()를 사용하면 다음을 기반으로 요소를 선택할 수 있습니다.
jQuery의 필터 메소드를 사용하면 문자열(즉, 선택기 표현식)을 매개변수로 전달할 수 있습니다.
또는 해당 반환 값은 선택 여부를 정의합니다. 전달된 함수는 현재 선택 세트의 각 요소에서 실행됩니다.
함수가 false를 반환하면 해당 함수는 반환 값이 true일 때마다 해당 요소가

jQuery(&#39;*&#39;).filter(function(){ 
return !!jQuery(this).css(&#39;
background
&#39;); 
});

로그인 후 복사

영향을 받지 않습니다.

초기 컬렉션은 모든 요소(*)입니다. 그런 다음 filter()가 함수를 매개변수로 호출됩니다.

이 함수는 각 컬렉션에 배경 속성이 있는지 여부를 판단합니다.
존재하는 경우 유지합니다. 그렇지 않으면 결과 집합에서 이 요소를 삭제합니다.
자바스크립트
는 정의되지 않은 빈 유형이며 물론 false입니다. 반환되면 함수는 false를 반환하므로 컬렉션에서 배경 속성이 없는 요소가 삭제됩니다.
실제로는 jQuery가 이러한 반환 값을 부울 유형으로 변환하므로 !!는 필요하지 않습니다. 이렇게 하면 누구나 귀하의 코드를 볼 때 귀하의 의도를 확실히 알 수 있습니다. (이것은 코드의 가독성에 도움이 됩니다.) filter()를 전달하는 함수에서 this 키워드는 현재를 참조합니다.
jQuery 함수에 포함시키면 jQuery 객체가 됩니다.
this //일반 요소 객체입니다.
jQuery(this) //jQuery 객체입니다.
다음은 여러분의 상상력을 자극하는 것입니다.

jQuery(&#39;p&#39;).filter(function(){ 
var width = jQuery(this).width; 
return width >100 && widht < 200; 
}); 
//返回子元素有10个或者20个的元素. 
jQuery(&#39;*&#39;).filter(function(){ 
var children = jQuery(this).childern().length; 
return children ===10 || children ===20; 
});

로그인 후 복사

<html> 
<head> 
<title></title> 
<style type="text/css"> 
.c1{ 
background-color
: yellow; 
} 
.c2{ 
background-color: green; 
} 
p{ 
background-color: pink; 
} 
h3{ 
background-color: gray; 
} 
</style> 
</head> 
<body> 
<p class="c1">Bye Bye Beautiful</p> 
<p class="c2">Nothing but the girl</p> 
<p>The Lazy song</p> 
<h2>If I die young</h2> 
<h3>New soul</h3> 
<script type="text/javascript" src="jquery.2.0.3.js"></script> 
<script type="text/javascript"> 
jQuery(document).ready(function($) { 
var ret = $(&#39;*&#39;).filter(function(index) { 
return !$(this).css(&#39;background-color&#39;); 
}); 
$.each(ret, function(index, val) { 
$(val).css(&#39;background-color&#39;,&#39;black&#39;); 
}); 
}); 
</script> 
</body> 
</html>

로그인 후 복사

믿습니다. 이 기사의 사례를 읽은 후 방법을 익혔습니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 다른 관련 기사를 주목하세요!

추천 도서:

테이블 작업을 위해 jQuery 플러그인 데이터 테이블을 적용하는 방법

js/jquery 파싱 json 메서드에 대한 자세한 설명

위 내용은 jQuery 필터 메소드 filter() 사용에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!