data() 메소드의 활용 jquery

jQuery에는 data()라는 메소드가 있다.

어떤 값을 저장하기 위한 메소드인데

 

저장하는 방식은

어떤 특정 dom객체를 지정하여 그 위치에 값을 저장한다.

 

$("body").data("키", "값");


위와 같이 저장을 하면 해당 dom 객체에는 jQuert + now() 된 키값의 attribute 가 생성되어진다.

 

해당 attribute에 부여된 번호는 data() 메소드를 생성한 순서대로 1,2,3.... 의 번호가 부여된다.

나중에 호출할 때 해당 dom 객체에서 해당 값을 찾기 위한 그룹 기준 값이 된다.

(난수는 단지 생성된 시간에 대한 값일 뿐이다.)

 

 

이와 같이 쓰게 되면 아래와 같은 이점들이 생긴다.

  1. Dom 객체 단위로 개별 변수 지정이 편해지므로 동일한 이름값을 쓰게 되어 발생할 문제를 미연에 방지한다. ( 닫힌 영역을 만들어 변수를 사용하게 되면 외부에서 꺼내 쓰는 어려움이 있지만 이에 대해서도 간편해진다. )
  2. var 로 생성한 변수가 가질 값들이 숨겨지게 되며, 또한 일일이 개별 변수를 만들 필요가 없어진다.

다만 이런 단점도 생긴다.

  1. Dom 객체와 개별적으로 운용되는 js에 대해서 객체에 종속되는 문제가 있다. ( html5에서 쓰일 worker같은 기능을 생각하면 dom과 분리되는 것이 더 좋다.)
  2. 해당 Dom 객체가 remove() 메소드로 호출되는 순간 해당 attribute의 값은 초기화 된다.
    • Dom 객체는 html에서만 사라질 뿐 javascript의 변수 영역에서는 보존되며 undefined가 아닌 null 설정이 된다.
    • emoty() 메소드의 경우 당연히 보존된다.
    • 1.4에 추가된 detach() 메소드를 사용해도 해당 attribute가 사라지는 이유로 null 설정이 된다.

 

java 의 변수를 어떻게 다룰것인가의 문제이긴 하지만

굳이 oop개념으로 js Object를 만들지 않아도 값을 가진 개체를 관리하기 편하다는 점에서

data() 메소드는 유용하다.

Share
이 글과 관련된 글
  1. [2011/10/23] jquery로 ajax호출시 로딩이미지 보여주기 by 날파리 (1160)
  2. [2011/10/03] Hypothesis in quantitative research by Creativity, Safety, and Life (1510)
  3. [2011/02/09] jquery ui menu() by 파란하늘 (1913)
  4. [2011/01/30] @PostFilter, @PreFilter by 파란하늘 (1004)
  5. [2010/12/08] servletContext에서 상위 context security annotation 사용하기 by 파란하늘 (1378)
Tag :

Leave Comments



T-NAVI