图片加载的src
src of image loading
在 html 文件中我有这样的东西：
<img src="dist/assets/img/photos/md/photo-1.jpg"/>
然后使用 JS 我检查 window 宽度并将图像的路径相应地更改为：
<img src="dist/assets/img/photos/xs/photo-1.jpg"/>
或
<img src="dist/assets/img/photos/lg/photo-1.jpg"/>
问题是，对于 xs window，它是仅加载 xs 大小的图像还是同时加载两者 - md（因为我在 html 中有 md 路径）加上来自 js 的 xs 大小的图像？
谢谢。
首先加载 md 文件，一旦加载 JavaScript，xs 也将被加载，<img> 的源将更改为 xs 文件的路径。
可以加载中等图像，但您不能保证这一点。事实上，javascript 几乎可以在 DOM 准备就绪后立即更改 src 属性值。图像等外部资源的请求不会阻止 DOM ready 事件的触发。
由于浏览器进行了相当积极的优化，因此获取媒体图像的请求可能已经发送。在（相对）高网络延迟的情况下，当脚本更改属性值时请求仍将挂起，否则，或者如果图像已经在缓存中，它将已经加载。
注意：为了解决响应图像的问题，srcset 属性可能会让您感兴趣。不过，这取决于 what browsers you should support。
在 html 文件中我有这样的东西：
<img src="dist/assets/img/photos/md/photo-1.jpg"/>
然后使用 JS 我检查 window 宽度并将图像的路径相应地更改为：
<img src="dist/assets/img/photos/xs/photo-1.jpg"/>
或
<img src="dist/assets/img/photos/lg/photo-1.jpg"/>
问题是，对于 xs window，它是仅加载 xs 大小的图像还是同时加载两者 - md（因为我在 html 中有 md 路径）加上来自 js 的 xs 大小的图像？
谢谢。
首先加载 md 文件，一旦加载 JavaScript，xs 也将被加载，<img> 的源将更改为 xs 文件的路径。
可以加载中等图像，但您不能保证这一点。事实上，javascript 几乎可以在 DOM 准备就绪后立即更改 src 属性值。图像等外部资源的请求不会阻止 DOM ready 事件的触发。
由于浏览器进行了相当积极的优化，因此获取媒体图像的请求可能已经发送。在（相对）高网络延迟的情况下，当脚本更改属性值时请求仍将挂起，否则，或者如果图像已经在缓存中，它将已经加载。
注意：为了解决响应图像的问题，srcset 属性可能会让您感兴趣。不过，这取决于 what browsers you should support。