HTMLImageElement: currentSrc-Eigenschaft

Wert

Ein String, der die vollstndige URL des Bildes angibt, das aktuell vom Browser zum Laden ausgewhlt wurde. Wenn das Bild das srcset-Attribut verwendet, ermglicht currentSrc es Ihnen zu bestimmen, welches Bild aus dem Satz bereitgestellter Bilder vom Browser ausgewhlt wurde. Der Wert der Eigenschaft ist unabhngig davon, ob das Bild erfolgreich geladen wurde oder nicht.

Beispiele

Testen, welches Bild geladen wird

In diesem Beispiel werden zwei verschiedene Gren fr ein Bild einer Uhr bereitgestellt. Eine ist 200px breit und die andere 400px breit. Das sizes-Attribut wird bereitgestellt, um anzuzeigen, dass das Bild bei einer Dokumentbreite von 50% gezeichnet werden sollte, wenn der Ansichtsbereich unter 400px breit ist; ansonsten wird das Bild mit 90% der Dokumentbreite gezeichnet.

HTML

<img
  src="/en-US/docs/Web/HTML/Reference/Elements/img/clock-demo-400px.png"
  alt="Clock"
  srcset="
    /en-US/docs/Web/HTML/Reference/Elements/img/clock-demo-200px.png 200w,
    /en-US/docs/Web/HTML/Reference/Elements/img/clock-demo-400px.png 400w
  "
  sizes="(width <= 400px) 50%, 90%" />

JavaScript

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

p.textContent = clockImage.currentSrc.endsWith("200px.png")
  ? "Using the 200px image!"
  : "Using the 400px image.";
document.body.appendChild(p);

Ergebnis

Spezifikationen

Browser-Kompatibilitt

Siehe auch

• HTMLImageElement.src
• HTMLImageElement.srcSet