>  기사  >  웹 프론트엔드  >  jQuery의 일반적인 데이터 처리 사용 예 요약

jQuery의 일반적인 데이터 처리 사용 예 요약

伊谢尔伦
伊谢尔伦원래의
2017-06-19 11:06:371265검색

여기에서는 jQuery의 일반적인 데이터 처리 사용법을 주로 소개하고, 예제에서는 Trim, param, isArray, isFunction, Each 등 jQuery의 일반적인 데이터 처리 방법을 요약합니다. jQuery를 처음 접하는 친구들은 사용법을 참고할 수 있습니다.

1. $.trim(): 문자열 앞뒤의 공백 문자를 제거합니다.

var str = ' 薯条 ';
var formatStr = $.trim(str);  //'薯条'

2. $.param(): 배열 또는 객체 직렬화.

var obj = {
  name: 'dog',
  count: 10
};
var str = $.param(obj); //"name=dog&count=10"

3. $.isArray(): 배열인지 확인하세요.
4.$.isFunction(): 함수형인지 확인하세요.
5. $.each(obj, [callback]):배열 또는 컬렉션 객체를 탐색합니다. obj는 탐색할 컬렉션 객체이고, callback은 각 멤버를 탐색할 때 시작되는 콜백 함수를 나타냅니다. 콜백 함수에는 두 개의 매개변수가 포함되어 있습니다. 첫 번째 매개변수는 객체 멤버 또는 배열의 인덱스이고 두 번째 매개변수는 해당 값입니다.

var a = [x,y,z];
$.each(a, function(index, value) {
  console.log(index); //0,1,2
  console.log(value); //x,y,z
});
var b = {x:1, y:2, z:3};
$.each(b, function(key, value)) {
  console.log(key);  //x,y,z
  console.log(value); //1,2,3
}

참고:each() 루프를 중간에 종료하려면 콜백 함수에서 false를 반환하면 다른 반환 값은 무시됩니다.

$.each() 및 $(selector).each()는 동일한 기능을 가지고 있지만 $.each()는 모든 객체 또는 배열을 순회할 수 있는 반면 $(selector).each()는 다음에서 선택한 jQuery만 순회할 수 있습니다. 현재 선택기 개체입니다.

6. $.makeArray(): 배열과 유사한 객체를 배열 객체로 변환합니다. 소위 배열형 객체는 길이 속성을 가지며 인덱스는 0부터 길이-1까지입니다. 그러나 이러한 객체는 배열 메서드를 호출할 수 없습니다.

var arr = $.makeArray($('li')); //类数组对象转换为数组
$('ul').html(arr.reverse()); //可以调用数组的reverse()方法了

7. $.grep(): 필터 기능에 따라 조건을 충족하지 않는 배열의 요소를 필터링합니다.

$.grep(array, callback, [invert]);

설명: 매개변수 array는 필터링할 배열을 나타내고, callback은 필터링 함수를 나타냅니다. 필터 함수가 true를 반환하면 요소가 유지되고, 필터 함수가 false를 반환하면 요소가 삭제됩니다. 매개변수 invert(선택 사항)는 false이거나 설정되지 않은 경우 필터 함수에서 true를 반환하는 배열 요소를 반환합니다. 이 매개 변수가 true이면 필터 함수에서 false를 반환하는 요소를 반환합니다.

var a = [1,2,3,4,5];
a = $.grep(a, function(value, index)) {
  return value > 3; //a现在为[4,5]
});
var b = [1,2,3,4,5];
b = $.grep(b, function(value, index)) {
  return value > 3; //b现在为[1,2,3]
}, true);

8. $.map(): 지도 배열.
$.map(array, callback);

var a = [1,2,3,4];
a = $.map(a, function(elem)) {
  return elem * 2; //a现在为[2,4,6,8]
});

9 $.merge(): 배열을 병합합니다.
설명: 두 개의 배열 매개변수를 허용합니다.

var a = [1,2,3];
var b = [4,5];
var c = $.merge(a,b); //c为[1,2,3,4,5];

10. $.unique(): DOM 요소 배열에서 중복 항목을 제거합니다.

...
<a id="1" class="link link1"></a>
<a id="2" class="link"></a>
<a id="3" class="link"></a>
...
var $link = $(&#39;.link&#39;); //包含#1,#2,#3
var $firstLink = $(&#39;.link1&#39;); //包含#1
var $links = $.merge($link, $firstLink); //包含#1,#2,#3,#1
var $linkList = $.unique($link); //包含#1,#2,#3

참고: 문자열이나 JavaScript 배열이 아닌 DOM 요소 배열만 처리할 수 있습니다.

위 내용은 jQuery의 일반적인 데이터 처리 사용 예 요약의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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