值
一个字符串，指示 HTMLImageElement 所代表的 <img> 元素中当前可见的图片的完整 URL。当您使用 sizes 和/或 HTMLImageElement.srcset 属性提供多个图像选项时，这非常有用。currentSrc 允许您确定在提供的图像集中，浏览器选择了哪张图像。
示例
在此示例中，为一张时钟图片提供了两种不同的尺寸。一种是 200px 宽，另一种是 400px 宽。提供了 sizes 属性来指示，如果视口宽度小于 400px，则图像应以文档宽度的 50% 的比例绘制；否则，图像以文档宽度的 90% 的比例绘制。
HTML
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
js
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 |
浏览器兼容性
加载中…