Kevin,
Boa noite.
Na realidade quando você faz uma requisição ajax, através de um $.ajax, $.post, $.get, as requisições sempre vão ser um XHR, mas o conteúdo da resposta pode ser um datatype: jpeg, gif, png, text/html, etc.
O Developer Tools, mostra o tipo de requisição que ele está fazendo quando disparado através do src de um Image
, ele entende que você tá carregando uma imagem.
Quando você faz a requisição através de um objeto XHR
(XMLHttpRequest
), ele entende que é um AJAX
, portanto aparece na aba XHR.
Na prática:
//Vai em network -> Images
var img = new Image();
img.src = "http://images.forbes.com/media/lists/companies/google_416x416.jpg";
//Vai aparecer em network -> XHR
$.ajax({
type: "GET",
url: "http://images.forbes.com/media/lists/companies/google_416x416.jpg",
dataType: "image/jpg",
cache: true
});
Resposta 2:
Para colocar uma imagem no cache, a melhor alternativa é usar o Expires Header
, caso você esteja utilizando o Apache, você pode procurar nesse link:
http://httpd.apache.org/docs/2.2/mod/mod_expires.html
display: none;
e depois mostras a imagem quando a página tiver carregado? Esse AJAX vai buscar o url da imagem?