Javascript 侦听图像加载调用并在图像加载之前更改 src

Question

我正在为此运行一个前端脚本来测试一些图像，而且时间安排很时髦，这使得它与众不同。

当向端点发出请求以加载图像时，我需要一种使用 Javascript 来捕获 img 的方法。我知道图像端点（例如 www.domain.com/directory/number.jpg ），我想更改它并指向不同的端点（例如 www.differentdomain.com/directory/number_2.jpg ）。 我已经尝试查找元素并更改 src 属性，但该元素似乎在 Document Ready 之后加载到页面上，因此轮询页面以查找元素的时间间隔很长。

这都是前端，在页面加载时运行，之后等待用户操作。

请注意，连续运行的 setInterval 并不能像我希望的那样精确地捕捉到这一点，它会为页面添加大量资源以使其运行足够长的时间。还有哪些其他选择？

---

我尝试使用 jquery 并在 setInterval 中轮询选择器，但这会为页面添加大量资源，以便每 10 毫秒轮询一次并捕获它。问题变成了分配事件监听页面上尚未出现的元素。 我刚刚遇到 Javascript Promises - 并且很好奇是否有一种可行的方法，尽管我对想法持开放态度。 谢谢！

Answer 1

您是否尝试使用 IIFE 函数而不是 Document Ready 来更改 src 属性？据我了解，您遇到图像元素加载缓慢的问题。使用 IIFE，您的代码无需准备好文档即可立即执行。

这是JSFiddle 文档就绪的示例

$(document).ready(function(){
    //some code
}

这是JSFiddle 的 IIFE 示例

!function (){
    //some code
}();

P.S 如果我误解了你的问题，我很抱歉。