Manipulacje DOM w Dojo

Dojotoolkit to potężne narzędzie do tworzenia aplikacji internetowych. Wśród narzędzi do tworzenia API aplikacji są elementy obsługujące zdarzenia (Events), a także narzędzia, dzięki którym możemy manipulować elementami DOM strony internetowej/aplikacji internetowej.

Dojo daje nam narzędzie w postaci dojo.query. Dzięki niemu obiekty DOM(Document Object Model)są dla nas łatwo dostępne i łatwo modyfikowalne. Parsuje się nie tylko pojedynczy obiekt, ale całe grupy węzłów DOM.

Przykład 1

dojo.require("dojo.NodeList-fx");
dojo.addOnLoad(function(){
	// pobieramy węzeł o id='testHeading'
	dojo.query("#testHeading")
		 // dodajemy "testClass" do jego atrybutu class="" 
		.addClass("testClass")
		 // a następnie ustawiamy znikanie na 500 ms
		.fadeOut({ delay:500 }).play();
});

Powyższy przykład pokazuje w jaki sposób szybko zmienić klasę CSS dla obiektu o określonym identyfikatorze. Pozwala on precyzyjnie wskazać element strony i określić dla niego nowy atrybut "class".

Można także rozbić zmiany na grupach elementów. Aby to zrobić wyszukuje się nie po identyfikatorze, ale po nazwie klasy CSS

Dojo.query potrafi stworzyć tablicę elemetów DOM, dzięki której w prosty sposób można manipulować grupą obiektów strony

Przykład 2

dojo.require("dojo.NodeList-fx");
dojo.addOnLoad(function(){
	// pobieramy elementy mające określona klasę CSS: class="para"
	dojo.query(".para")
                // podmieniamy ją klasą testClass
		.addClass("testClass")
		.fadeOut({ delay: 1000 }).play();
});

Gdyby na stronie było 100 obiektów mających argument class="para", to za jednym zamachem zmieniamy dla tych obiektów nazwę klasy CSS,określającą wygląd tych elementów strony

Powyższe przykłady to tylko mała próbka możliwości Dojotoolkit. Niesłychanie potężne narzędzie pozwala programiście na dowolną manipulację obiektów DOM strony, przyśpiesza pracę nad aplikacją, daje niesamowite rezultaty w krótkim czasie