`
qihuiyong6
  • 浏览: 41018 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

iframe会导致Jquery入口代码执行延时较长

阅读更多
问题描述:
   信息时变慢,经过排查发现是浏览器解析完HTML后 直到 JQuery执行的开始位置延迟了2-4秒。当时那个页面引入了很多第三方的js库如tree,date,easyui等等。我以为慢的原因是这些类库,但是注释掉后依然很慢。

    家后继续想这个问题,当时就想到会不会是iframe加载了其他页面变慢的。今天在公司把页面上的iframe src属性注释掉,果然速度快了很多由以前的2秒变成了50毫秒左右。

总结:
   使用iframe的时候最好延时加载,需要的时候再去加载。如果遇到页面上Jquery入口延时较长,很可能就是页面中包含了iframe。
经验分享给大家,理解不到位的大家拍砖。
分享到:
评论

相关推荐

    JQUERY实现iframe页面切换功能

    在上述代码中,`$(document).ready`确保了jQuery代码在HTML文档加载完毕后执行。`switchPage`函数负责改变iframe的`src`属性,从而加载新的页面。我们用`index`变量记录当前页面的位置,并使用模运算符实现循环切换...

    动态创建iframe,并动态添加js执行代码

    总结来说,动态创建iframe并动态添加js执行代码是Web开发中的重要技术,它能够帮助我们实现异步加载、跨域通信等功能,但同时也需要注意相关的安全问题。通过熟练掌握这些技术,开发者能够构建更复杂、更灵活的Web...

    jquery横排页签Tab+iframe代码示例

    **jQuery横排页签Tab与iframe整合的代码示例** 在网页设计中,页签(Tab)是一种常见的用户界面元素,用于将大量信息组织成不同的类别,提高用户体验。本示例将详细介绍如何使用jQuery实现横排页签,并结合iframe...

    jquery 跨iframe拖拽

    本篇文章将详细探讨"jquery 跨iframe拖拽"这一主题,该技术允许用户在不同的IFrame之间进行元素的拖放操作,这对于构建多窗口、多面板的Web应用尤其有用。 首先,我们要理解IFrame(内联框架)的概念。IFrame是一种...

    Jquery实现iframe功能

    // 在这里添加你想要在iframe加载完成后执行的代码 }); ``` 需要注意的是,由于同源策略的限制,如果iframe加载的内容与包含它的页面不在同一域名下,我们可能无法直接访问或修改iframe内的内容。这是一条重要的...

    jquery点击按钮隐藏父页和引用页的iframe

    通常,我们会通过在`<head>`标签内添加以下代码来引入`jQuery`: ```html <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> ``` 接下来,假设你有一个`iframe`元素,其`id`为`myIframe`,你...

    Iframe模拟Jquery.Ajax

    通过深入理解这些知识点,并结合提供的"Iframe模拟Ajax-经典"压缩包中的代码示例和文档,你可以更有效地掌握如何在面临同源策略限制时,使用Iframe来模拟Ajax请求,实现跨域数据交互。这将有助于你在开发过程中解决...

    jquery.iframe-transport.js包

    jquery.iframe-transport.js包

    使用jQuery和ajax代替iframe的方法(详解)

    使用jQuery,可以非常方便地执行ajax请求,实现异步数据交互。 使用jQuery和ajax代替iframe的主要方法在于:通过JavaScript动态地获取外部HTML内容,并将其插入到当前页面的指定容器中。这种做法可以保持页面的整体...

    jQuery-1.8.3(&2.1.4).min.js&jquery;.fileupload&jquery;.iframe-transport

    本篇将深入探讨jQuery的核心库以及两个重要的插件——jQuery File Upload和jQuery Iframe Transport。 首先,jQuery的核心库jQuery-1.8.3.min.js和jQuery-2.1.4.min.js是其发展过程中的两个稳定版本。1.8.3属于1.x...

    jQuery弹出层 可加载iframe 功能强大 简单易用

    在这个特定的案例中,标题和描述提到的“jQuery弹出层可加载iframe”指的是一个利用jQuery实现的弹出窗口,它能够嵌入一个iframe(内联框架)来展示外部网页或应用程序。 首先,我们需要理解jQuery是什么。jQuery是...

    jquery iframe动态添加删除tab选项卡

    jquery iframe动态添加tab选项卡 jquery iframe动态添加tab选项卡 jquery iframe动态添加tab选项卡 jquery iframe动态添加tab选项卡 jquery iframe动态添加tab选项卡 jquery iframe动态添加tab选项卡 jquery iframe...

    jquery对iframe自适应高度插件

    然而,`iframe`的默认高度和宽度可能并不适合所有情况,特别是当内容动态变化时,可能会导致滚动条的出现或内容被截断。为了解决这个问题,`jQuery`提供了一个专门的插件——"jquery对iframe自适应高度插件"。 这个...

    jQuery 网页打印组件升级版(支持打印 iframe 内的内容)

    jQuery 网页打印组件升级版是一个强大的工具,尤其对于处理iframe打印需求的开发者来说,它简化了工作流程,提高了代码的可维护性。通过理解和充分利用这个组件,我们可以为用户提供更完善的打印功能,增强网站的...

    jquery tab 切换页面 支持iframe

    标题"jquery tab 切换页面 支持iframe"所指的就是如何在jQuery Tab组件中嵌入和切换`iframe`内容。 jQuery Tab的基本原理是通过JavaScript和CSS来创建一个可交互的导航条,每个选项对应一个内容区域。当用户点击...

    用jquery实现iframe高度自适应实例代码完美兼容多数浏览器

    本篇文章将深入讲解如何使用jQuery来解决`iframe`高度自适应的问题,并且确保代码在多数浏览器中都能完美运行。 首先,我们了解`iframe`的基本概念。`iframe`(Inline Frame)是HTML中的一个元素,用于在当前文档中...

    前端项目-Iframe-Height-Jquery-Plugin.zip

    它利用jQuery的选择器功能找到页面上的所有iframe元素,然后对每个元素执行以下步骤: 1. **监听加载事件**:插件会监听iframe的`load`事件,确保在内容加载完成后进行高度计算。 2. **计算内容高度**:一旦iframe...

    基于jquery的兼容各种浏览器的iframe自适应高度的脚本

    这段代码的关键在于`$("#c-c-iframe").load()`函数,该函数会在iframe加载完成后执行回调函数。在回调函数中,通过`$(this).contents().find("#content")`选择器获取到iframe内部指定id为`#content`的元素,并读取其...

    Jquery调用iframe父页面中的元素及方法

    在使用jQuery进行操作时,需要注意的是jQuery本身并不提供跨iframe域的直接支持。因此,这里提到的方法和实例都基于同源策略,即父页面和iframe页面属于同一域名。如果尝试在不同源的iframe中操作元素,将会遇到跨域...

    超实用的jQuery代码段

    超实用的jQuery代码段精选近350个jQuery代码段,涵盖页面开发中绝大多数要点、技巧与方法,堪称史上最实用的jQuery代码参考书,可以视为网页设计与网站建设人员的好帮手。《超实用的jQuery代码段》的代码跨平台、跨...

Global site tag (gtag.js) - Google Analytics