HTMLImageElement : propriété currentSrc

La propriété en lecture seule currentSrc de HTMLImageElement indique l'URL de l'image sélectionnée par le navigateur pour être chargée.

Valeur

Une chaîne de caractères indiquant l'URL complète de l'image actuellement sélectionnée par le navigateur pour être chargée. Si l'image utilise l'attribut srcset, currentSrc permet de déterminer quelle image parmi celles fournies a été sélectionnée par le navigateur. La valeur de la propriété n'est pas liée au fait que l'image ait été chargée avec succès ou non.

Exemples

Tester quelle image est chargée

Dans cet exemple, deux tailles différentes sont proposées pour une image d'horloge. L'une fait 200px de large et l'autre 400px. L'attribut sizes indique que l'image doit être affichée à 50% de la largeur du document si la zone d'affichage (viewport en anglais) fait moins de 400px de large ; sinon, l'image est affichée à 90% de la largeur du document.

HTML

html

<img
  src="/fr/docs/Web/HTML/Reference/Elements/img/clock-demo-400px.png"
  alt="Horloge"
  srcset="
    /fr/docs/Web/HTML/Reference/Elements/img/clock-demo-200px.png 200w,
    /fr/docs/Web/HTML/Reference/Elements/img/clock-demo-400px.png 400w
  "
  sizes="(width &lt;= 400px) 50%, 90%" />

JavaScript

const clockImage = document.querySelector("img");
const p = document.createElement("p");

p.textContent = clockImage.currentSrc.endsWith("200px.png")
  ? "Image de 200px utilisée !"
  : "Image de 400px utilisée.";
document.body.appendChild(p);