>  기사  >  웹 프론트엔드  >  jQuery의 map() 및 get()에 대한 자세한 분석

jQuery의 map() 및 get()에 대한 자세한 분석

黄舟
黄舟원래의
2017-07-19 16:25:031554검색

jQuery에는 $( " li " )와 같은 "array-like"라는 개념이 있습니다. 컬렉션을 얻으면 배열의 일부 속성이 있지만 instancseof Array는 여전히 false입니다. 하지만 var a=$( "li" ).get()이렇게 처리한 다음instancseof 배열은 true를 반환합니다.

var a=$( "li" ).get(1) 에 일련 번호를 추가하면 단일 요소를 얻을 수 있다는 점에 유의해야 합니다. 이러한 요소의 특성은 jQuery 개체가 아니라 Js 개체이므로 jQuery 메서드는 직접 사용할 수 없습니다.

map()의 기능은 크게 두 단계로 이루어집니다. 첫 번째 단계는 이동이고 두 번째 단계는 교체입니다.

  $( " li " ).map( function(  ){
    return  $(this).text(  );  // 注意return关键字不可少
} )


먼저 지도를 순회하고 각 항목은 text() 값을 반환한 다음 map은 자동으로 $("li") 컬렉션 의 각 항목 값을 다음 값으로 바꿉니다. 그래서 이때는 여전히 실제 배열이 아닌 배열과 유사합니다(여전히 $(" li ")의 쉘이기 때문입니다). 따라서 나중에 get() 작업을 추가하면 실제 배열로 바뀌므로 배열 전용 메서드인 Join()을 사용할 수 있습니다.

예:

    $( " li " ).map( function(  ){
        return  $(this).text(  );   
    } ).get(  ).join("%")            // 拼接成字符串,中间用“%”隔开


추가됨:
map() 및 get()은 다음과 같이 배열 코드를 직접 조작할 수도 있습니다.

var arrayObj=["www","xxx","ddd"];
var ww=$.map(arrayObj,function(i){
                      return i;
              }).join(",");
console.log(ww);
var tt=$(":checkbox").map(function(){
                     return this.value;
          }).get().join(",");
console.log(tt);

위 내용은 jQuery의 map() 및 get()에 대한 자세한 분석의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.