'utility'에 해당되는 글 1건

  1. 2014.07.15 jQuery Utility API

jQuery Utility API

Posted by 단순대왕 jQuery : 2014. 7. 15. 10:39

$.fx.off 

- 효과를 활성화하거나 비활성화한다.

$.support 

- 지원하는 기능의 세부사항을 제공한다.

$.browser 

- 상세한 브라우저 정보를 제공한다.

$.trim(value) 

- 문자열 다듬기. 공백 문자열을 제거하고 결과를 반환

- $('#someField').val($.trim($('#someField').val())); 

$.each(container, callback) 

- 프로퍼티와 컬렉션 순회

- $.each(anArray, function(배열의 인덱스 또는 객체 프로퍼티 이름, 배열의 아이템 또는 프로퍼티 값){

   });

* DOM 엘리먼트 확장 집합의 엘리먼트를 순회하는 each() method도 있음

$.grep(array, callback, invert) 

- 배열 필터링

- 콜백 함수의 반환 값은 값이 $.grep() 함수의 값으로 반환된 새로운 배열로 수집될지 아닐지 결정

- var zips = $.grep(

   orgArray, 

   function(현재 데이터 값, 원본 배열의 인덱스){ return value.match(/^\d{5}(-\d{4})?$/) != null;}, 

   true);

$.map(array, callback)

- 배열 변환하기

- 함수 호출로 반환된 값은 새로운 배열로 수집

- var oneBased = $.map([0,1,2,3,4], function(현재 데이터 값, 원본 배열의 인덱스){return value+1;});

$.inArray(value, array)

- 전달된 값이 처음 나타나는 위치 인덱스를 반환

- var index = $.inArray(2, '1,2,3,4,5]);

$.makeArray(Object)

- 전달된 유사 배열 객체를 자바스크립트 배열로 변환

- 유사 배열 객체: var images = document.getElementsByTagName("img"); // NodeList

$.unique(array)

- DOM 엘리머트 배열이 주어지면, 원본 배열에서 고유한 엘리먼트로만 구성된 배열을 반환

$.merge(array1, array2)

- 두 번째 배열의 값들을 첫 번째 배열에 추가하고, 그 결과를 반환

- 첫 번째 배열을 수정되어 반환

- $.merge([1,2,3,4,5], [6,7,8,9,0]);

$.extend(deep, target, source1, source2, ... sourceN)

- target에 전달된 객체를 함께 전달된 나머지 객체의 프로퍼티를 사용하여 확장

- deep: 깊은 복사 또는 얕은 복사를 결정

- target: 원본 객체의 프로퍼티를 복사하여 프로퍼티가 추가되는 객체

- source: target 객체에 추가되는 프로퍼티를 가진 하나 이상의 객체

var object1 = {  apple: 0,  banana: { weight: 52, price: 100 },  cherry: 97 };

var object2 = {  banana: { price: 200 },  durian: 100};

$.extend( object1, object2 );

// {"apple":0,"banana":{"price":200},"cherry":97,"durian":100}

// 중복되는 객체가 있으면 object2 기준, object1 + object2

$.extend( true, object1, object2 );

// {"apple":0,"banana":{"weight":52,"price":200},"cherry":97,"durian":100}

// 중복되는 프로퍼티가 있으면 object2 기준, object1 + object2

$.extend( false, object1, object2 );

// {"apple":0,"banana":{"weight":52,"price":100},"cherry":97}

// 중복되는 모든 값에 object1 기준, object1

$.param(param, traditional)

- 쿼리 문자열로 인코딩 (encodeURIComponent())

- $.param({'a thing':'it&s=value', 'another thing':'another value'});

// a+thing=it%26s%3Dvalue&another+thing=another+value

- traditional: 중첩된 구조의 쿼리 문자열을 구성

$.isArray(o)

- o가 자바스크립트 배열이면 true/ 유사 배열이면 false

$.isEmptyObject(o)

- o가 자바스크립트 프로퍼티가 없는 객체이면 true

$.isFunction(o)

- o가 자바스크립트 함수이면 true

$.isPlainObject(o)

- o가 객체 리터럴({}) 이나 new Object()로 생성되었다면 true

$.isXMLDoc(node)

- node가 XML 문서이거나, XML 문서 안에 위치한 노드일 경우 true

$.noop

- 아무것도 하지 않는다.

$.contains(container, containee)

- 엘리먼트가 또 다른 엘리먼트의  DOM계층에 포함되어 있는지 검사

$.data(element, name, value)

- 전달된 엘리먼트에 데이터를 명시한 이름으로 저장하거나 가져온다.

- value: 값이 생략되면 전달된 이름에 맞는 데이터를 가져온다.

- $('div').data("test", {first:'16', last:'pizza'});

  $('span.first').text($(div).data(test).first);

$.removeData(element, name)

- 전달된 엘리먼트에 저장된 데이터를 제거한다.

$.proxy(function, proxy)

$.proxy(proxy, property)

- 함수가 호출될 때 객체를 미리 함수에 바인딩할 수 있다.

- 바인딩된 객체는 해당 함수의 컨텍스트가 된다.

- function: 프록시 객체로 미리 바인딩될 함수

- proxy: 프록시 함수 컨텍스트로 바인딩될 객체

- property: 바인드된 함수를 포함하는 프록시로 전달된 객체에 위치한 프로퍼티의 이름

- $('#testButton, #buttonContainer').click(

    function(){  say(this.id);  }

);

$('#testButton, #buttonContainer').click(

    $.proxy(function(){  say(this.id);  }, $('#controlPanel')[0]) 

);

- $.proxy()를 가장 빈번하게 사용하는 예는 객체의 메소스를 핸들러로 바인딩하려는 때이며, 메소드를

  지닌 객체가 마치 메소드를 직접 호출한 것과 동일하게 핸들러의 함수 컨텍스트로 할당

- var o = {  id:'o', hello:function(){alert(this.id);  }

- $(해석가능한  표현식).click(o.hello); // 함수 컨텍스트는 o가 아닌 현재 버블링 엘리먼트

- $(해석가능한 표현식).click(  $.proxy(o.hello, o)  ); // 함수 컨텍스트는 o

또는

- $(해석가능한 표현식).click(  $.proxy(o, 'hello')  ); // 함수 컨텍스트는 o

$.parseJSON(json)

- 전단된 JSON 문자열을 파싱하여, 그 결과(객체)를 반환한다.

$.globalEval(code)

- 전역 컨텍스트에서 전달된 자바스크립트 코드를 평가한다.

$.getScript(url, callback)

- 동적으로 스크립트 로드하기

- url 매개변수가 명시한 서버에 GET 요청을 사용하여 스크립트를 가져오며, 성공시 콜백함수 실행


'jQuery' 카테고리의 다른 글

jQuery 확장 메소드 만들기  (0) 2014.07.16
jQuery Deprecated API  (0) 2014.07.15
jQuery 사용자 정의 함수 만들기  (0) 2014.07.15
jQuery 확장  (0) 2014.07.15
jQuery 새로운 기술이 아니라 새로운 생각  (0) 2014.07.14
  
 «이전 1  다음»