JQuery: Fazendo mais com menos?
JQuery é um biblioteca escrita em JavaScript. Seu intuito é de facilitar o desenvolvimento de scripts com JavaScript; A biblioteca facilita diversos tipos de manipulações com dados e também a chamadas Ajax. Com JQuery algumas operações que era complexas se tornam mais fáceis.
Para usar a biblioteca basta fazer o include js padrão. A Grande vantagem do JQuery é prover compatibilidade para browsers como Opera, IE, Saffari, Mozilla e outros, além de compatibilidade com CSS.
$(document).ready(function() {
alert('Ola mundo!');
}
No código acima temos a sobre-escrita da clássica função onLoad do formulário, mas dá maneira JQuery. O os códigos do JQuery devem estar dentro de alguma função para funcionarem. Para descobrirmos se o Browser é o Firefox poderíamos fazer algo do tipo:
$(document).ready(function() {
alert("O Browser é o mozilla? " + $.browser.mozilla);
});
O JQuery possibilita um série de facilidades, dentre elas eu destaco os filters. Veja o código a baixo:
$("input").filter(".btn").click(function(e){
$("#dv01").html("Hahaha! JQuery Rocks!").insertAfter("#teste");
}).end();
Nesse código estou percorrendo todos os elementos do formulário que forem do tipo "input" e que tenham a class css "btn". Após achar esses elementos estou adicionando o evento onClick em todos os resultados encontrados. Também estou programando o que acontecera se o evento OnClick for disparado. O objeto de HTML com o id "dv01" que pode ser um div por exemplo, recebera o conteúdo html. Ainda estou dizendo para posicionar o elemento após outro elemento de id "teste".
Utilizar Ajax é muito simples também, pode ser feito com o simples código:
$("#meuDiv").load('TesteJQuery2.html');
Sendo que esse código deve estar dentro de uma função para funcionar. Para chamas mais complexas ou quando você precisa de uma função de callback o JQuery possui outras opções mais avançadas para o uso de Ajax. Você pode encontrar essas informações e muito mais no livro JQuery in Action.
Atenção: É evidente que o uso de JQuery facilita o trabalho com JavaScript, mas não posso deixar de lembrar que o fato de usar JQuery não significa mais performance. JavaScript deve ser usado com cautela, aplicações 100% podem ter problemas com os browsers dos clientes. Eu já trabalhei em uma empresa em que o projeto era 100% Ajax e browser em questão parado sem o usuário fazer nada pesava 90mb na memória do cliente.
Até próxima. :)
Para usar a biblioteca basta fazer o include js padrão. A Grande vantagem do JQuery é prover compatibilidade para browsers como Opera, IE, Saffari, Mozilla e outros, além de compatibilidade com CSS.
$(document).ready(function() {
alert('Ola mundo!');
}
No código acima temos a sobre-escrita da clássica função onLoad do formulário, mas dá maneira JQuery. O os códigos do JQuery devem estar dentro de alguma função para funcionarem. Para descobrirmos se o Browser é o Firefox poderíamos fazer algo do tipo:
$(document).ready(function() {
alert("O Browser é o mozilla? " + $.browser.mozilla);
});
O JQuery possibilita um série de facilidades, dentre elas eu destaco os filters. Veja o código a baixo:
$("input").filter(".btn").click(function(e){
$("#dv01").html("Hahaha! JQuery Rocks!").insertAfter("#teste");
}).end();
Nesse código estou percorrendo todos os elementos do formulário que forem do tipo "input" e que tenham a class css "btn". Após achar esses elementos estou adicionando o evento onClick em todos os resultados encontrados. Também estou programando o que acontecera se o evento OnClick for disparado. O objeto de HTML com o id "dv01" que pode ser um div por exemplo, recebera o conteúdo html. Ainda estou dizendo para posicionar o elemento após outro elemento de id "teste".
Utilizar Ajax é muito simples também, pode ser feito com o simples código:
$("#meuDiv").load('TesteJQuery2.html');
Sendo que esse código deve estar dentro de uma função para funcionar. Para chamas mais complexas ou quando você precisa de uma função de callback o JQuery possui outras opções mais avançadas para o uso de Ajax. Você pode encontrar essas informações e muito mais no livro JQuery in Action.
Atenção: É evidente que o uso de JQuery facilita o trabalho com JavaScript, mas não posso deixar de lembrar que o fato de usar JQuery não significa mais performance. JavaScript deve ser usado com cautela, aplicações 100% podem ter problemas com os browsers dos clientes. Eu já trabalhei em uma empresa em que o projeto era 100% Ajax e browser em questão parado sem o usuário fazer nada pesava 90mb na memória do cliente.
Até próxima. :)
