Redescobrindo o Javascript com JQuery

Já ouviu falar em JQuery? Não?!? Então não sabe o que está perdendo. Hoje, não consigo me imaginar fazendo Javascript de outra maneira. Só para você ter uma idéia, um script que eu tinha feito para um projeto que pretendo colocar no ar em breve tinha por volta de 130 linhas de código. Utilizando JQuery caiu para 20 linhas!!!

Toda a parte burocrática do DOM (criar elementos, selecioná-los, etc) é feito de maneira genial, utilizando notação CSS 1.3 ou XPath básico. Não sabe do que estou falando? Veja um exemplo:

<div id="content">
	<p>This is the first line.</p>
	<p>And this is the <strong>second one</strong>.</p>
</div>

Se quisessemos adicionar um terceiro parágrafo, da maneira tradicional teríamos algo como:

var p = document.createElement('p');
p.appendChild(document.createTextNode("Hi! I'm the third paragraph"));

var div = document.getElementById('content');
div.appendChild(p);

ou, se você não liga muito para DOM:

var div = document.getElementById('content');
div.innerHTML += "<p>Hi, I'm the third paragraph.</p>";

Agora, se fossemos fazer isto em JQuery, seria mais ou menos assim:

$('div#content').append("<p>Hi, I'm the third paragraph. And powered by JQuery.</p>");

Sentiu a diferença? Você pode dizer que utilizando innerHTML nem fica tão dispendioso, mas algo muito errado poderia acontecer (anular eventos adicionados ao elemento, por exemplo). Com JQuery, isso nunca acontecerá, pois ele cria um elemento temporário e depois clona cada nodo, adicionando-o ao elemento-alvo. Simplesmente, perfeito!

Quer mais? Ele possui apenas 16kb, já com o módulo de AJAX. Nada mal se compararmos com os 60kb do Prototype (somente ele, sem o Script.aculo.us).

Uma coisa é certa: você ainda vai ouvir falar muito bem de JQuery.