XMLHttpRequest

Todos os navegadores modernos têm um objeto XMLHttpRequest integrado, usado para solicitar dados do servidor.

objeto XMLHttpRequest

O objeto XMLHttpRequest pode ser usado para solicitar dados do servidor web.

O objeto XMLHttpRequest éSonho do desenvolvedorporque você pode:

• Atualizar a página web - sem recarregar a página
• Pedir dados do servidor - após a carga da página
• Receber dados do servidor - após a carga da página
• Enviar dados para o servidor - em segundo plano

Exemplo XMLHttpRequest

Quando você digitar caracteres no campo de entrada abaixo, um XMLHttpRequest será enviado para o servidor e retornará algumas sugestões de nomes (do servidor):

Exemplo

Por favor, insira o nome no campo de entrada abaixo:

Enviar XMLHttpRequest

A seguir está a sintaxe comum do JavaScript para usar o objeto XMLHttpRequest:

Exemplo

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
       // Ação típica a ser executada quando o documento estiver pronto:
       document.getElementById("demo").innerHTML = xhttp.responseText;
    }
};
xhttp.open("GET", "filename", true);
xhttp.send();

Experimente você mesmo

Explicação do exemplo

Na primeira linha do exemplo acima, foi criado um objeto XMLHttpRequest:

var xhttp = new XMLHttpRequest();

onreadystatechange A propriedade especifica a função a ser executada sempre que o estado do objeto XMLHttpRequest mudar:

xhttp.onreadystatechange = function()

quando readyState propriedade for 4 e status Quando o atributo for 200, a resposta está pronta:

if (this.readyState == 4 && this.status == 200)

responseText Os atributos são retornados na forma de string de texto da resposta do servidor.

Strings de texto podem ser usadas para atualizar a página da web:

document.getElementById("demo").innerHTML = xhttp.responseText;

Você aprenderá mais sobre o objeto XMLHttpRequest no capítulo AJAX deste tutorial.