WEB2.0/ajax

dojo Framework part 2.유틸리티 함수

시반 2008. 3. 13. 13:53

제 2 장 유틸리티 함수


앞서 말한바 있지만 ajax를 구현하기 위해 prototype을 주로 사용해왔던 터라

주로 $()를 애용해왔는데 dojo에서는 그대로 문자로 표현되는것이 아닌가.

이에 이번장에서는 dojo의 유틸리티 함수들을 살펴보기로 한다

dojo에서는 $()대신 dojo.byId()를 사용한다.

 

언듯 $()에 비하여 불편해보이기도 하는 dojo.byId()는 dojo 개발팀에서도 꽤 오랜 고민과 토론 끝에 내린 결론이라고 하니

어쩌겠는가. 기냥 써야지. 사실 document.getElementById()보다는 짧다. ㅋㅋ

 

* 지정한 id를 가진 DOM node를 검색

* dom
var node = document.getElementById('abc');

* prototype
var node = $('abc');

* dojo
var node = dojo.byId('abc');


 

* 지정한 노드 이름(태그 이름) / CSS 셀렉터를 가진 DOM node들(배열)을 검색

* dom

var nodes = document.getElementsByTagName('div');

* prototype
var nodes = $$('div');
var nodes = $$('.item');
var nodes = $$('#title);
var nodes = $$('div.item');
...

* dojo

var nodes = dojo.query('div');
var nodes = dojo.query('.item');
var nodes = dojo.query('#title');
var nodes = dojo.query('div.item');
...

 

dojo.query()도 prototype이나 jquery와 비슷한 CSS 2.1 셀렉터를 지원한다.

 

prototype에서 $$와 each()의 결합을 많이 쓰는 것처럼, dojo.query()도forEach()와 함께 쓰면 편리하다.