Loading [MathJax]/jax/input/TeX/config.js
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >检测页面是否正在加载任何资源。

检测页面是否正在加载任何资源。
EN

Stack Overflow用户
提问于 2014-06-01 13:56:26
回答 1查看 1.7K关注 0票数 4

是否可以确定页面是否正在加载任何资源,包括在HTML文档加载之后还是从新的ajax请求中?

用例是我有一个站点,我需要在那里拍摄一个截图,但想要等到一切都呈现出来。这意味着:

  1. DOM已经完全加载(即使使用普通的JS也很容易检测到这一点)
  2. 所有资源(css、js等)都已加载。
  3. 任何可能发生在操作中的AJAX调用都已完成。(可能是最难的部分)

检测动画和CSS转换是困难的,也不是必要的。如果你有一个涵盖1-3的解决方案,我会接受的。如果您还知道如何检测CSS转换和JS动画等,那么您将非常棒,我将接受这一点:)

EN

回答 1

Stack Overflow用户

发布于 2014-06-05 00:30:47

我认为要回答这个问题,我们应该从不同的角度出发。

首先,您要将所有javascript代码包装为

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
$( window ).load(function() {
  // Run code
});

这将迫使您的函数在页面完全加载时触发,包括图形、载荷法

引用jquery网站

当一个元素和所有子元素被完全加载时,load事件将被发送到它。此事件可以发送到与URL关联的任何元素:图像、脚本、框架、iframes和窗口对象。

这种方法将解决第1点和第2点,这与在加载DOM时触发就绪法略有不同。

第三点有点难处理,但是你可以用

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
$( document ).ajaxStop(function() {
  //run code here
});

因为它注册了一个处理程序,以便在所有Ajax请求完成后调用- ajaxStop

引用jquery网站

每当Ajax请求完成时,jQuery都会检查是否还有其他未决的Ajax请求。如果没有保留,jQuery将触发ajaxStop事件。此时将执行已在.ajaxStop()方法中注册的任何和所有处理程序。如果上次未完成的Ajax请求通过在ajaxStop回调函数中返回false来取消,则还会触发beforeSend事件。

最后的代码如下所示:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
$( window ).load(function() {
      $( document ).ajaxStop(function() {
           //run code here
       });
});

希望能帮上忙!

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/23984907

复制
相关文章
用 preload 预加载页面资源
本文主要介绍preload的使用,以及与prefetch的区别。然后会聊聊浏览器的加载优先级。
ConardLi
2019/09/23
1.9K0
用 preload 预加载页面资源
JavaScript判断页面是否已经加载完毕
  在做针对CheckBox框点击事件的时候,发现点击以后有时候会报错,但是是生成的JavaScript的代码的内部错误,无法判断到底是什么地方有问题。就一直在找问题。刚刚突然想到可能与页面的加载状态有关。就来试了试果然如此。
aehyok
2018/09/11
2.4K0
进阶 | 用 preload 预加载页面资源
前端爱好者的聚集地 本文主要介绍preload的使用,以及与prefetch的区别。然后会聊聊浏览器的加载优先级。 preload 提供了一种声明式的命令,让浏览器提前加载指定资源(加载后并不执行),在需要执行的时候再执行。提供的好处主要是 1. 将加载和执行分离开,可不阻塞渲染和 document 的 onload 事件 2. 提前加载指定资源,不再出现依赖的font字体隔了一段时间才刷出 如何使用 preload 使用 link 标签创建 使用 HTTP 响应头的 Link 字段创建 如我们常用到
用户1097444
2022/06/29
1.3K0
进阶 | 用 preload 预加载页面资源
在bash中检测进程是否正在运行
比如我们启动了一个这样的进程python -m SimpleHTTPServer 8000,我们想检测这个进程是否存在,可以这样。
技术小黑屋
2018/09/04
3.6K0
imagesLoaded – 检测网页中的图片是否加载
imagesLoaded 是一个用于来检测网页中的图片是否载入完成的 JavaScript 工具库。支持回调的获取图片加载的进度,还可以绑定自定义事件。可以结合 jQuery、RequireJS 使用。
李维亮
2021/07/09
1.7K0
JavaScript 页面资源加载方法onload,onerror总结
……如果加载失败怎么办?例如,这里没有这样的脚本(error 404)或者服务器宕机(不可用)。
winty
2021/03/11
4.5K0
如何检测本页中的iframe是否“加载”完成
这其实是上一篇"iframe框架取值兼容ie/firefox/chrome的写法"的扩展应用: 应用场景:iframe个人感觉最独特的应用之一就是配合P3P协议可以实现跨域写入cookie(好象除此之外,还没找到更有效的办法),但是有时候我们不知道这个iframe页面是否执行完毕,有没有办法判断iframe里的页面是否load完成了呢? iframe1.html: <html> <head> <title>框架内页</title> </head> <body> <div> <input id="txt
菩提树下的杨过
2018/01/23
3.6K0
Spring MVC 框架学习(六)---- 返回页面+加载静态资源
  返回非页面的数据,必须在方法或者类上加 @ResponseBody,同时 我们返回的类型 springmvc会自动解析成对应的格式,不需要我们进行手动指定
RAIN7
2022/08/23
1.2K0
Spring MVC 框架学习(六)---- 返回页面+加载静态资源
使用 Preload&Prefetch 优化前端页面的资源加载
对于前端页面来说,静态资源的加载对页面性能起着至关重要的作用。本文将介绍浏览器提供的两个资源指令-preload/prefetch,它们能够辅助浏览器优化资源加载的顺序和时机,提升页面性能。
2020labs小助手
2020/11/11
1.3K0
Android正在加载动画
animation 和 animator 对应两种加载效果 不设置时即默认值是animation
黄林晴
2019/01/10
2.3K0
3种检测页面是否符合amp标准的方法
  AMP的关键优势不仅仅在于它能让你的页面更快,还在于它的快可以被验证。有几种方法可以验证AMP文档,它们都会产生完全相同的结果,选择最适合您的开发风格的方法。除了AMP的有效性,您可能还想确认您的AMP文档是否可被第三方平台发现。
ytkah
2019/05/25
1.5K0
vue 重新加载页面_页面重新加载
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
全栈程序员站长
2022/11/03
4.7K0
各浏览器对页面外部资源加载的策略
各浏览器对页面外部资源加载的策略        这个总结来源于一次优化的请求,最初某个页面的加载十分缓慢,load事件迟迟无法触发,因此希望可以通过对静态文件分域名等方式对页面的外部资源进行优化,拿得load事件尽可能早地触发。 于是我查看了页面的源码,并对外部资源进行了整理,基于下面2个理念画出了一个推测的瀑布图: 浏览器对同一个域只能并发2个HTTP请求 – 网上盛传已久。 javascript文件的加载会阻塞浏览器其他资源的加载 – 同样网上盛传已久。 然而,当我看到各浏览器中实际的瀑布图时,我知道
小端
2018/04/16
1.1K0
检测是否IE
从jQuery的jQuery.browser里面拿出来的,jQuery从1.9开始废弃这个方法,改用jQuery.support来检测浏览器支持的特性。
libo1106
2018/08/08
1K0
再谈DOMContentLoaded与渲染阻塞—分析html页面事件与资源加载
浏览器的多线程中,有的线程负责加载资源,有的线程负责执行脚本,有的线程负责渲染界面,有的线程负责轮询、监听用户事件。
周陆军
2018/08/02
2.4K0
再谈DOMContentLoaded与渲染阻塞—分析html页面事件与资源加载
分享 4个解决 https页面加载http资源报错的方法
改https初看起来,其实就是一个域名指向的问题,也许咱们只要将http的请求,直接跳转到https地址去,那么也就完成了https的切换。实际并非这么简单的。
winty
2022/02/18
3.9K0
分享 4个解决 https页面加载http资源报错的方法
改https初看起来,其实就是一个域名指向的问题,也许咱们只要将http的请求,直接跳转到https地址去,那么也就完成了https的切换。实际并非这么简单的。
前端达人
2021/12/27
21.1K0
再谈DOMContentLoaded与渲染阻塞—分析html页面事件与资源加载
浏览器的多线程中,有的线程负责加载资源,有的线程负责执行脚本,有的线程负责渲染界面,有的线程负责轮询、监听用户事件。
周陆军
2018/05/22
5.1K0
页面加载代码
在footer文件添加以下内容 少女祈祷中... document.onreadystatechange = function()   //当页面加载状态改变的时候执行function {    if(document.readyState == "complete"){ var df = document.getElementsByClassName("Bg_Th")[0]; df.style.display="none";   } } 自
云计算小黑
2022/12/28
3.1K0
使用 Preload&Prefetch 优化前端页面的资源加载「建议收藏」
对于前端页面来说,静态资源的加载对页面性能起着至关重要的作用。本文将介绍浏览器提供的两个资源指令-preload/prefetch,它们能够辅助浏览器优化资源加载的顺序和时机,提升页面性能。
全栈程序员站长
2022/11/15
1.5K0
使用 Preload&Prefetch 优化前端页面的资源加载「建议收藏」

相似问题

检测是否正在加载新页。

10

是否正在检测<link>资源的负载?

13

如何检测浏览器是否正在加载新页面

20

检查webdriver是否正在加载外部资源

21

检测是否有任何窗口正在被拖动

20
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文