>웹 프론트엔드 >JS 튜토리얼 >jQuery의 두 가지 맵 함수 방법에 대한 샘플 코드

jQuery의 두 가지 맵 함수 방법에 대한 샘플 코드

黄舟
黄舟원래의
2017-07-19 16:32:151655검색

이 기사에서는 jquery의 지도 기능에 대한 두 가지 방법을 공유합니다. 이 기능이 필요한 친구는 이를 참조할 수 있습니다.

두 가지 방법:

1.


//将原数组中每个元素加 4 转换为一个新数组。
$.map( [0,1,2], function(n){
 return n + 4;
});
//结果:
[4, 5, 6]
//原数组中每个元素扩展为一个包含其本身和其值加 1 的数组,并转换为一个新数组
$.map( [0,1,2], function(n){
 return [ n, n + 1 ];
});
//结果:
[0, 1, 1, 2, 2, 3]

2. Traverse object.map

예:


<form method="post" action="">
 <fieldset>
  <p>
   <label for="two">2</label>
   <input type="checkbox" value="2" id="two" name="number[]">
  </p>
  <p>
   <label for="four">4</label>
   <input type="checkbox" value="4" id="four" name="number[]">
  </p>
  <p>
   <label for="six">6</label>
   <input type="checkbox" value="6" id="six" name="number[]">
  </p>
  <p>
   <label for="eight">8</label>
   <input type="checkbox" value="8" id="eight" name="number[]">
  </p>
 </fieldset>
</form>
$(&#39;:checkbox&#39;).map(function() {
 return this.id;
}).get().join(&#39;,&#39;);

결과: 2, 4, 6, 8

분석:

map()의 함수는 주로 2단계로 구성됩니다. , 첫 번째 단계는 순회이고 두 번째 단계는 교체입니다.


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

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

위 내용은 jQuery의 두 가지 맵 함수 방법에 대한 샘플 코드의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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