HTMLImageElement: currentSrc 属性

只读的 HTMLImageElement 属性 currentSrc 指示当前在它所代表的 <img> 元素中呈现的图像的 URL。

值

一个字符串，指示当前在由 HTMLImageElement 表示的 <img> 元素中可见的图像的完整 URL。这在您使用 sizes 和/或 HTMLImageElement.srcset 属性提供多个图像选项时很有用。currentSrc 允许您确定浏览器从提供的图像集中选择了哪个图像。

示例

在这个例子中，为一个时钟图像提供了两种不同的尺寸。一种是 200px 宽，另一种是 400px 宽。提供了 sizes 属性来指示如果视窗宽度小于 400px，则图像应以文档宽度的 50% 绘制；否则，图像应以文档宽度的 90% 绘制。

HTML

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

浏览器兼容性

BCD 表格仅在浏览器中加载