Hoje estava conversando com um amigo que começou a estudar AJAX
para fazer uma entrevista de emprego para programador Jr e que pediam conhecimentos básicos de PHP, AJAX e JQuery.
Perguntei para ele o que você entende por AJAX?
“É um bagulho que pega informações do lado servidor sem
precisar recarregar a página.”
A resposta esta certa e o conceito é este.
Então hoje resolvi criar um post sobre o que é o tal de AJAXem um
exemplo pratico e simples de entender que mostrei para meu amigo.
Vamos usar o JQuery para fazer a conexão AJAX.
No exemplo vamos pegar o conteúdo de uma pagina “texto.html” e adicionar
o conteúdo na página “index.html” em uma tag span.
Vamos criar uma página index.html com o código abaixo.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>EXEMPLO BASICO DO USO DO AJAX COM JQUERY</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
</head>
<body>
<input type="button" onclick="ajax();" value="Pegar texto" name="Pegar texto" />
<br />
<span id="conteudo_ajax"></span>
</body>
</html>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
function ajax () {
// Caso queira limpar o valor do elemento antes de adicionar remova o comentario abaixo.
//$("#conteudo_ajax").empty();
jQuery.ajax({
type: "get", // Defino o método de envio POST / GET
url: 'texto.html', // Informo a URL que será pesquisada.
success: function(html){
$("#conteudo_ajax").append(html); // Adiciono o valor dentro do elemento.
}
});
}
</script>
Agora crie uma página texto.html com o texto para pesquisa
Texto que foi pego usando AJAX.
O código é simples mas já dá uma idéia de como funciona o AJAX para quem esta começando a estudar.
Comentários são bem vindos assim posso melhorar a qualidade dos tutoriais aqui apresentados.
É isso pessoal uma ótima semana e até o próximo post.
Mas onde é que entra o XML aí?
Não precisa ter alguma interação com XML, já que o AJAX trabalha com XML_HTTP_REQUEST ?
Obrigado!
Ele suporta XML ou Plain Text. O conceito de XMLHttpRequest foi criado pela Microsoft para ser usado no Outlook Web Access para Microsoft Exchange Server 2000 e um tempo depois foi adicionado no Internet Explorer 5.0 em março de 1999.
Hoje o XMLHttpRequest faz parte da API do DOM que pode ser usando no Javascript.
Atualmente é muito usado a formação dos dados usando o padrão JSON com Plain Text.
Opa marcelo gostei muito do tópico, mais tem um problema, e se eu quero pegar a página que está localizada em outro servidor, isso não é possivel ?
eu li que teria que criar um CGI para o servidor, mais nada é certeza, Poderia me ajudar com isso !?
É possível ser em outro servidor sim. Basta informar a URL e ter permissão para acessar.
Quando clico no botão nada ocorre. O que pode ser?
Estou clicando no botão e nada ocorre! Alguém pode me ajudar? O que poderia ser?
Obrigada.
Laís
Olá Laís vc chegou a criar o arquivo texto.html com algum texto nele?
Você precisa criar este arquivo no mesmo diretorio do arquivo index.html para que ele possa fazer a leitura.
Outro detalhe é que estou usando o Jquery que esta hospedado no google entao para rodar o software é necessario ter conexão com a internet.
Olá Karla vc criou o arquivo texto.html?