HTMLImageElement: свойство currentSrc

Только для чтения HTMLImageElement свойство currentSrc указывает URL изображения, которое в настоящее время отображается в элементе <img>.

Значение

Строка, указывающая полный URL изображения, которое в данный момент отображается в элементе <img>, представленном HTMLImageElement. Это полезно, когда вы предоставляете несколько вариантов изображений с помощью свойств sizes и/или HTMLImageElement.srcset. currentSrc позволяет определить, какое изображение из набора предоставленных изображений было выбрано браузером.

Примеры

В этом примере для изображения часов предоставлены два размера. Один — 200 пикселей в ширину, другой — 400 пикселей в ширину. Атрибут sizes используется для указания того, что изображение должно быть отображено на 50% ширины документа, если ширина области просмотра меньше 400 пикселей; в противном случае изображение отображается на 90% ширины документа.

HTML

<img
  src="/en-US/docs/Web/HTML/Element/img/clock-demo-400px.png"
  alt="Clock"
  srcset="
    /en-US/docs/Web/HTML/Element/img/clock-demo-200px.png 200w,
    /en-US/docs/Web/HTML/Element/img/clock-demo-400px.png 400w
  "
  sizes="(max-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);

Результат

Спецификации

Спецификация
HTML # dom-img-currentsrc-dev

Совместимость с браузерами

	Рабочие столы					Мобильные устройства
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox для Android	Opera Android	Safari на iOS	Samsung Internet	WebView Android
`currentSrc`	38	13	38	25	9.1	38	38	25	9.3	3.0	38

© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/currentSrc