我一直在研究可以更改图像 src 的 Javascript。我只是想知道这是否可以在浏览器尝试获取原始图像之前完成。
例子。
Src="Large-Image"
我可以(使用 javascript,我想……也许是 node.JS?)为用户服务 src="smaller-image"
?
显然,如果浏览器首先加载大图像,则不会有性能提升。
最佳答案
我不这么认为,JS 需要 image-tag 才能访问属性,所以它必须晚于此执行(就像在 documentReady 上或放置在标签之后),但在那个时候浏览器已经开始下载图像。
但是,我见过一些解决方案,您不在“src”属性上设置 url,而是在另一个属性名称上设置 url,例如“data-src”。您的 Javascript 可以将该 url 动态设置为“src”属性,以提示浏览器开始下载。
例如(假设加载了 jQuery):
<img data-src="http://www.url.nl/image.png" />
<script>
$("img").each(function (index, element) {
var $element = $(element);
var imageUrl = $element.attr("data-src");
//Do your checks here to change the image-url to a smaller one when required
$element.attr("src", imageUrl);
});
</script>
关于javascript - 是否可以在原始图像加载之前更改图像 src ="",我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26167734/