o que é ajax

AJAX Flávio Luiz Schiavoni – EspWeb UEM - 2006

O que é Ajax? ,[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006

O que é Ajax? ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006

O que é Ajax? ,[object Object],[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006

Modelo tradicional Flávio Luiz Schiavoni – EspWeb UEM - 2006 http://pt.wikipedia.org/wiki/AJAX_(programa%C3%A7%C3%A3o)

Com Ajax Flávio Luiz Schiavoni – EspWeb UEM - 2006

Porque comunicação Assícrona? ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006

Exemplo: webmail ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006

Como funciona? ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006

Revisão Javascript para Ajax Flávio Luiz Schiavoni – EspWeb UEM - 2006

Pegando elementos do documento ,[object Object],[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006 elementoPorId.html elementoPorNomeTag.html

Adicionando e removendo ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006 adicionandoElemento.html

Adicionando Eventos ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006 adicionandoEventos.html

XMLHttpRequest Flávio Luiz Schiavoni – EspWeb UEM - 2006

Criando a requisição ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006

Recebendo resposta ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006 ,[object Object]

Propriedades do objeto ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006 Exemplo: redirecionar.html

Estado do objeto: readyState ,[object Object],[object Object],[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006

Estado da resposta ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006

Métodos ,[object Object],[object Object],[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006

Método open() ,[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006 open(“método”,”url”,true/false)

Métodos HTTP ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006

Atenção! Flávio Luiz Schiavoni – EspWeb UEM - 2006 O método open(“método”,”url”,false) só é capaz de acessar “url” dentro do próprio domínio não sendo capaz de acessar endereços absolutos, ou seja, endereços que começam com http:// www.......

Método send() ,[object Object],[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006 Note-se que se pretende enviar ( POST ) dados, você deve alterar o tipo MIME do pedido usando a seguinte linha: req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); De outra forma o servidor irá ignorar os dados.

onreadystatechange ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006 O que fazer quando o estado for alterado? Esta função será chamada toda vez que o estado o objeto for alterado, ou seja, 1, 2, 3 e 4

Cadê o X do Ajax? XML Flávio Luiz Schiavoni – EspWeb UEM - 2006

Porque XML? ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006

Exemplo de XML ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006

Requisição para XML ,[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006

XML DOM - Árvores Flávio Luiz Schiavoni – EspWeb UEM - 2006

Javascript DOM - propriedades ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006

Javascript DOM - métodos Flávio Luiz Schiavoni – EspWeb UEM - 2006 AppendChild – adiciona um novo nó filho HasChildNodes – booleano se o nó tem filhos RemoveChild – remove um nó filho CreateAttribute – Cria um novo atributo para o elemento CreateElement – Cria um novo elemento documento CreateTextNode – Cria um item texto

Ajax e WebService ,[object Object],[object Object],[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006 Exemplo: cep.jsp e buscaCEP.jsp

Ajax Framework ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006 ,[object Object],[object Object],[object Object],[object Object]

Por que não Ajax? ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006

Exemplos ,[object Object],[object Object],[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006

Referências ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Flávio Luiz Schiavoni – EspWeb UEM - 2006

o que é ajax

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Ähnlich wie o que é ajax

Ähnlich wie o que é ajax (20)

Mehr von elliando dias

Mehr von elliando dias (20)

o que é ajax