data() 메소드의 활용 jquery
2010.09.02 16:24 Edit
jQuery에는 data()라는 메소드가 있다.
어떤 값을 저장하기 위한 메소드인데
저장하는 방식은
어떤 특정 dom객체를 지정하여 그 위치에 값을 저장한다.
$("body").data("키", "값");
위와 같이 저장을 하면 해당 dom 객체에는 jQuert + now() 된 키값의 attribute 가 생성되어진다.
해당 attribute에 부여된 번호는 data() 메소드를 생성한 순서대로 1,2,3.... 의 번호가 부여된다.
나중에 호출할 때 해당 dom 객체에서 해당 값을 찾기 위한 그룹 기준 값이 된다.
(난수는 단지 생성된 시간에 대한 값일 뿐이다.)
이와 같이 쓰게 되면 아래와 같은 이점들이 생긴다.
- Dom 객체 단위로 개별 변수 지정이 편해지므로 동일한 이름값을 쓰게 되어 발생할 문제를 미연에 방지한다. ( 닫힌 영역을 만들어 변수를 사용하게 되면 외부에서 꺼내 쓰는 어려움이 있지만 이에 대해서도 간편해진다. )
- var 로 생성한 변수가 가질 값들이 숨겨지게 되며, 또한 일일이 개별 변수를 만들 필요가 없어진다.
다만 이런 단점도 생긴다.
- Dom 객체와 개별적으로 운용되는 js에 대해서 객체에 종속되는 문제가 있다. ( html5에서 쓰일 worker같은 기능을 생각하면 dom과 분리되는 것이 더 좋다.)
- 해당 Dom 객체가 remove() 메소드로 호출되는 순간 해당 attribute의 값은 초기화 된다.
- Dom 객체는 html에서만 사라질 뿐 javascript의 변수 영역에서는 보존되며 undefined가 아닌 null 설정이 된다.
- emoty() 메소드의 경우 당연히 보존된다.
- 1.4에 추가된 detach() 메소드를 사용해도 해당 attribute가 사라지는 이유로 null 설정이 된다.
java 의 변수를 어떻게 다룰것인가의 문제이긴 하지만
굳이 oop개념으로 js Object를 만들지 않아도 값을 가진 개체를 관리하기 편하다는 점에서
data() 메소드는 유용하다.
이 글과 관련된 글
- [2011/10/23] jquery로 ajax호출시 로딩이미지 보여주기 (1160)
- [2011/10/03] Hypothesis in quantitative research (1510)
- [2011/02/09] jquery ui menu() (1913)
- [2011/01/30] @PostFilter, @PreFilter (1004)
- [2010/12/08] servletContext에서 상위 context security annotation 사용하기 (1378)
- Tag :
- study , jquery , data() 메소드
