Bild "nachladen" mit Ladesymbol

[Lars van der Meer]

Hallo, ich bin ein wenig skeptisch bei der Auswahl der richtigen Methodik zum Erreichen meines Ziels..

ZIELVORGABE: per Klick ist ein Bild in einen vordefinierten Container meiner PHP-Datei nachzuladen. Zusätzlich soll für die Dauer der Ladezeit ein Lade-GIF auf den Ladevorgang aufmerksam machen. ...das Ganze ohne Bibliotheken, nur php, javascript.

...ist dafür ein XMLHttpRequest notwendig? http://www.html5rocks.com/de/tutorials/file/xhr2/ hat dafür ja recht schöne Fallbeispiele parat (würde für mein Vorhaben die Sektion: Datei oder Blob hochladen: xhr.send(Blob) in Frage kommen?)

Bin auch über https://capdroid.wordpress.com/2015/03/09/html-download-image-through-ajax-and-display-it/ gestolpert; - nur: ist dies auch tatsächlich der richtige Weg für mein Vorhaben?

was spricht zum Beispiel dagegen, einfach mit einer onclick Aufforderung eine Javascript Funktion auszulösen, in der dann erst die Bild-URL, bzw. das Ziel-<DIV> bekanntgegeben wird? Dies erscheint mir zwar einfacher, jedoch wird z.B."complete" bzw. "ok" [readyState==4 && status==200] komplett außen vor gelassen.

Ich bin daher ob der verschiedenen Lösungsansätze ein wenig verunsichert - wie ist die definierte Zielvorgabe korrekt umzusetzen, sodass sie auch allen Anforderungen und Standards entspricht? XMLHttpRequest notwendig und sinnvoll oder Overkill?

Vielen Dank für jeden Deut in die richtige Richtung, Lars.