> 웹 프론트엔드 > JS 튜토리얼 > jQuery를 사용하는 방법 각각() method_jquery

jQuery를 사용하는 방법 각각() method_jquery

WBOY
풀어 주다: 2016-05-16 18:31:56
원래의
1438명이 탐색했습니다.

jQuery와 jQuery 개체 모두 이 메서드를 구현합니다. jQuery 개체의 경우에는 각 메서드가 간단하게 위임됩니다. 즉, jQuery 개체는 jQuery의 각 메서드에 첫 번째 매개 변수로 전달됩니다. 즉, jQuery에서 제공하는 각 메서드는 다음의 모든 하위 요소입니다. 매개변수 1에 의해 제공된 객체는 하나씩 호출됩니다. jQuery 객체가 제공하는 각 메소드는 jQuery 내부의 하위 요소를 하나씩 호출합니다.

코드 복사 코드는 다음과 같습니다.

jQuery.prototype.each=function( fn , args ) {
return jQuery.each( this, fn, args );
}

jQuery에서 제공하는 각 메소드의 구체적인 구현을 살펴보겠습니다.
jQuery.each(obj ,fn,arg)
이 메서드에는 세 가지 매개 변수가 있습니다. 즉, 작업할 개체 obj, 작업할 함수 fn, 함수 매개 변수 args입니다.
ojb 객체를 기준으로 살펴보겠습니다.

1. obj 객체는 배열입니다.
각 메서드는 배열의 하위 요소에 대해 하나씩 fn 함수를 호출합니다. 특정 하위 요소를 호출하여 반환된 결과는 false가 될 때까지입니다. 즉, 제공된 fn 함수로 이를 처리하고 특정 조건을 충족한 후 각 메서드 호출을 종료할 수 있습니다. 각 메소드가 arg 매개변수를 제공하는 경우 fn 함수 호출에 의해 전달된 매개변수는 arg입니다. 그렇지 않으면 하위 요소 인덱스, 하위 요소 자체
2.obj 객체가 배열이 아닙니다
이 메소드와 1의 가장 큰 차이점은 fn 메소드가 반환 값에 관계없이 하나씩 실행된다는 것입니다. 즉, fn 함수가 false를 반환하더라도 obj 객체의 모든 속성은 fn 메서드에 의해 호출됩니다. 호출에 전달된 매개변수는 1과 유사합니다.
코드 복사 코드는 다음과 같습니다.

jQuery.each=function( obj, fn , args ) {
if ( args ) {
if ( obj.length == 정의되지 않음 ){
for ( var i in obj )
fn.apply( obj, args )
}else{
for ( var i = 0, ol = obj.length; i < ol; i ) {
if ( fn.apply( obj, args ) === false )
break;

}

}
} else {
if ( obj.length == undefine ) {
for ( var i in obj )
fn.call( obj, i , obj );
}else{
for ( var i = 0, ol = obj.length, val = obj[0]; i < ol && fn.call(val,i,val ) != = false; val = obj[ i] ){}

}
}
return obj;
}

특별히 주의해야 합니다. 각 메소드에 대한 fn의 구체적인 호출 메소드는 단순한 fn(i,val) 또는 fn(args)가 아니라 fn.call(val,i,val) 또는 fn.apply(obj.args) 형식을 취합니다. 그러면 자체 fn 구현에서 이 포인터를 직접 사용하여 배열이나 객체의 하위 요소를 참조할 수 있습니다. 이 방법은 대부분의 jQuery에서 사용되는 구현 방법입니다.
jQuery에는 사용하기 매우 재미있는 Each 메소드가 있습니다. 이전처럼 for 루프를 작성할 필요도 없습니다. jQuery 소스 코드에서도 각 메소드를 많이 사용할 수 있습니다.
실제로 jQuery의 각 메소드는 js의 call 메소드를 통해 구현됩니다.
다음은 통화 방법에 대한 간략한 소개입니다.
호출 방법은 매우 훌륭합니다. 사실 공식적인 설명은 "객체의 메소드를 호출하고 현재 객체를 다른 객체로 대체합니다." 입니다. 인터넷에서 더 많은 설명은 컨텍스트 환경을 변경하는 것입니다. 어떤 사람들은 이 포인터를 바꾸라고 말합니다.
call([thisObj[,arg1[, arg2[, [,.argN]]]]])
매개변수
thisObj
선택 사항. 현재 객체로 사용될 객체입니다.
arg1, arg2, , argN
선택 사항. 일련의 메소드 매개변수가 전달됩니다.
설명
call 메서드는 다른 개체 대신 메서드를 호출하는 데 사용할 수 있습니다. call 메소드는 함수의 객체 컨텍스트를 초기 컨텍스트에서 thisObj가 지정한 새 객체로 변경합니다.
인터넷에서 아주 고전적인 예를 인용
Js 코드
코드 복사 코드는 다음과 같습니다.

함수 추가(a,b)
{
alert(a b)
}
함수 하위(a,b)
{
alert(a-b) );
}
add.call(sub,3,1);

sub를 add, add.call(sub,3,1) == add(3, 1) 따라서 실행 결과는 다음과 같습니다. Alert(4);
참고: js의 함수는 실제로 개체이며 함수 이름은 Function 개체에 대한 참조입니다.
여기서 구체적인 통화에 대해서는 더 자세히 언급하지 않겠습니다.
다음은 jQuery의 각 메소드의 몇 가지 일반적인 용도입니다
Js 코드
코드 복사 코드는 다음과 같습니다.

var arr = [ "하나", "둘", "셋", "넷"]
$.each(arr, function(){
alert(this);
})
//위 각각의 출력 결과는 다음과 같습니다. 1, 2, 3, 4
var arr1 = [[1, 4, 3], [4, 6, 6], [7 , 20, 9]]
$.each(arr1, function(i, item){
alert(item[0]);
})
//사실 arr1은 2입니다. -차원 배열, 항목은 각 1차원 배열을 취하는 것과 같습니다.
//item[0]은 각 1차원 배열의 첫 번째 값을 취하는 것과 같습니다
//위의 각 결과는 다음과 같습니다. 1 4 7
var obj = { 1:1, 2:2, 3:3, 4:4}
$.each(obj, function(key, val) {
alert(obj[ key] );
})
//이는 더욱 강력하며 모든 속성을 순환할 수 있습니다.
//출력 결과는 다음과 같습니다. 1 2 3 4
관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿