Question

我正在尝试使用JavaScript从客户端计算另一个域的加载时间。我知道你可以使用“script”和“img”标签的“src”属性来做到这一点，但我不确定如何在加载完成后（或一旦失败）获得回调。

我看到的用于加载外部内容的大多数解决方案都是服务器端的，但我正在尝试在客户端执行此操作。

Answer 1

如果您希望使用load方法以编程方式确定何时加载文件，则可以使用jQuery。

否则，您可以使用所有主流浏览器的开发人员工具查看所有图像和脚本的加载时间。

Answer 2

如果您只是在呼叫完成时想要回叫而不是真的需要阅读服务器响应，则可以使用Onload OnAbort OnError script个事件}或img标记。

var i=new Image(1,1);
i.src = url;
i.onload = function(){
  alert('load complete')
}; 
i.onabort = function(){
  aletrt('aborted')
}

Answer 3

您只需将事件侦听器附加到元素的load事件即可。类似的东西：

function imgLoaded(){
    //do something cool
}

var img = new Image;
img.addEventListener("load", imageLoaded, false);

您可以看到此here的示例。图像最初是通过display:none隐藏的，这意味着它不会开始被取出。然后，使用JS，我创建一个Image对象，将事件监听器附加到load事件，然后将其源设置为与img标记的源相同。完全加载后，将显示<img>。并且你会看到它尽管是一个非常大的图像立即出现 - 这是因为它被激活，直到加载事件被触发。

定时跨域页面加载时间

3 个答案: