1.图片

<img id="MyImg" src="src"/>
jquery实现:
$("#MyImg").load(function(){
})
说明:在jquery中load方法是在对象加载完毕后触发

javascript实现:

JS判断img图片是否加载完成:使用onload或者onreadystatechange

function   isImgLoad(){
    if(!!window.ActiveXObject){  // IE
        if(img.readyState == 'complete'){
            alert('finished');
        }
        else{
            alert('loading');
        }
    }
    else{
        // 非IE
        if(img.complete == true){
            alert('finished');
        }
        else{
            alert('loading');
        }
    }
}

2.动态加载js,css文件

function loadjscssfile(filename,filetype){

if(filetype == "js"){

var fileref = document.createElement('script');

fileref.setAttribute("type","text/javascript");

fileref.setAttribute("src",filename);

}else if(filetype == "css"){

var fileref = document.createElement('link');

fileref.setAttribute("rel","stylesheet");

fileref.setAttribute("type","text/css");

fileref.setAttribute("href",filename);

}

if(typeof fileref != "undefined"){

document.getElementsByTagName("head")[0].appendChild(fileref);

}

}

loadjscssfile("do.js","js");

loadjscssfile("test.css","css");

3.判断iframe是否加载完成

var iframe = document.createElement("iframe");

iframe.src = "http://www.jb51.net";

if (!/*@cc_on!@*/0) { //if not IE

iframe.onload = function(){

alert("Local iframe is now loaded.");

};

} else {

iframe.onreadystatechange = function(){

if (iframe.readyState == "complete"){

alert("Local iframe is now loaded.");

}

};

}

document.body.appendChild(iframe);

或者:

var iframe = document.createElement("iframe");

iframe.src = "http://www.jb51.net";

if (iframe.attachEvent){

iframe.attachEvent("onload", function(){

alert("Local iframe is now loaded.");

});

} else {

iframe.onload = function(){

alert("Local iframe is now loaded.");

};

}

document.body.appendChild(iframe);

判断脚本,图片,CSS,iframe等是否加载完成的更多相关文章

  1. JS脚本文件的位置对页面加载性能影响以及无阻塞脚本(javascript)模式

    JS的阻塞特性:当<script>出现的时候,页面必须等待脚本文件的加载.解析.执行完毕后才能继续进行页面的渲染.不管脚本文件是以内联形式还是外部引入的形式出现在<script> ...

  2. 使用jquery插件实现图片延迟加载技术(懒加载)

    有时我们看到一些大型网站,页面如果有很多图片的时候,当你滚动到相应的行时,当前行的图片才即时加载的,这样子的话页面在打开只加可视区域的图片,而其它隐藏的图片则不加载,一定程序上加快了页面加载的速度,对 ...

  3. 性能优化-css,js的加载与执行

    前端性能优化 css,js的加载与执行 javascript是单线程的 一个网站在浏览器是如何进行渲染的呢? html页面加载渲染的过程 html渲染过程的一些特点 顺序执行,并发加载 词法分析 并发 ...

  4. 网页加载速度优化2--先加载css,然后再加载js文件。

    网页加载时,是按从上到下,从左到右的顺序加载的.所以一定要先加载css文件(不要让用户看到一个杂乱无章的页面),最后再加载js文件,js一般都是处理功能的,所以不需要提前加载.先给用户观感,再给用户上 ...

  5. 在.NET MVC下不用iframe实现局部加载html

    最近在做个后台系统,之前都是用iframe来实现加载内容,左侧菜单不刷新.但一直不喜欢这种方法,有许多弊端.今天自己在网上查找了一番后找到了比较好的替代方案: 一.利用html的锚点标记来实现无刷新页 ...

  6. js不需要知道图片宽高的懒加载方法(经过实际测试,不加宽高仍然是无法正常加载的,设置height:auto,height:100%,仍然显示高度为0)

    js不需要知道图片宽高的懒加载方法 懒加载是如何实现的? - 简书https://www.jianshu.com/p/e86c61468285找到一个不需要知道图片宽高的懒加载方法了(经过实际测试,不 ...

  7. 180729-Quick-Task 动态脚本支持框架之任务动态加载

    Quick-Task 动态脚本支持框架之任务动态加载 前面几篇博文分别介绍了整个项目的基本架构,使用说明,以及整体框架的设计与实现初稿,接下来则进入更细节的实现篇,将整个工程中核心实现捞出来,从为什么 ...

  8. IE下iframe不能正常加载,显示空白

    下午帮忙看了一个web问题,index.html中嵌入<iframe>来加载同文件目录下的一个页面,在多个浏览器下测试,发现IE浏览器中会出现问题,<iframe>不能正常加载 ...

  9. 使用css实现loading的加载

    使用css实现loading的加载的效果图 html代码 <div id="caseVerteClaire"> <div id="transform&q ...

随机推荐

  1. ASP.NET常用技巧方法代码断

    1. 打开新的窗口并传送参数:传送参数:response.write("<script>window.open('*.aspx?id="+this.DropDownLi ...

  2. 新版本ubuntu13.10软件安装

    问题1:如何解决ubunt13.04不能和主机共享文件的问题 . 安装VMware Tools 网上有很多的资料,这里没有给出. . 设置共享文件夹目录 ) 在VMware虚拟机窗口,选择VM-> ...

  3. [GRYZ2015]工业时代

    试题描述 小FF的第一片矿区已经开始运作了, 他着手开展第二片矿区……小FF的第二片矿区, 也是”NewBe_One“计划的核心部分, 因为在这片矿区里面有全宇宙最稀有的两种矿物,科学家称其为NEW矿 ...

  4. CSAPP(1):数字的计算机表示——课后题

    2.65 int even_ones(unsigned x) 要求:return 1 when x contains an even number of 1s; 0 otherwise. 假设int ...

  5. 五、python使用模块

    if __name__=='__main__':用法: 当我们在命令行运行模块文件时,Python解释器把一个特殊变量__name__置为__main__,而如果在其他地方导入该hello模块时,if ...

  6. CoffeeScript学习(2)—— 变量

    变量基础 对于变量的定义的话,形式如下所示 xxx = yyy ------编译后------ var xxx = yyy; 保留字 我们知道,在原生js中的保留字是不能作为变量名或者属性名的.如果我 ...

  7. Java邮件服务学习之五:邮箱服务服务端 Apache

    Apache James(Java Apache Mail Enterprise Server)是Apache组织的子项目之一,完全采用纯Java技术开发,实现了SMTP.POP3与NNTP等多种邮件 ...

  8. 无奈卸载Clover 转投TotalCommand

    Clover 是个好的多Tab 资源管理器,但在Win8下总是崩溃啊,让人很崩溃. 无奈投奔TotalCommand吧,就是梯度有些高. 当然不习惯,也可以使用下 XYPlorer

  9. Spring入门(2)-通过构造器注入Bean

    Spring入门(2)-通过构造器注入Bean 前一篇文章将了最基本的spring例子,这篇文章中,介绍一下带有参数的构造函数和通过构造器注入对象引用. 0. 目录 带有参数的构造函数 通过构造器注入 ...

  10. jQuery基础学习8——层次选择器next()和prev()方法

    $('.one + div').css("background","#bbffaa"); //和next()方法是等价的,前后关系,和prev()方法是对立的 ...