判断JS是否加载完成

  在正常的加载过程中,js的加载都是同步的,也就是在加载过程中,浏览器会阻塞接下来的内容的加载。这时候我们就要用到动态加载,动态加载是异步的,如果我们在后边要用到这个动态加载的js文件里的东西,就要保证这个文件加载完成后,再执行下面的内容。

  如何判断js是否加载完成?(实现loadScript(url,callback)异步加载脚本,完成后执行回调函数,要求支持IE)

我们使用document的readyState属性:document.readyState

  readyState 属性返回当前文档的状态。

  该属性返回以下值:

  • uninitialized - 还未开始载入
  • loading - 载入中
  • interactive - 已加载,文档与用户可以开始交互
  • complete - 载入完成  (loaded)

原生JS:

function loadScript(url,callback){  var script=document.createElement(‘script‘);    script.type=‘text/javascript‘;    script.async=‘async‘;    script.src=url;    document.body.appendChild(script);    if(script.readyState){   //IE      script.onreadystatechange=function(){        if(script.readyState==‘complete‘||script.readyState==‘loaded‘){          script.onreadystatechange=null;          callback();        }      }    }else{    //非IE      script.onload=function(){callback();}    }}

Jquery:使用 $.holdReady(true);  $.getScript();   $.holdReady(false)   3个函数实现

$.holdReady(true);    //hold住,等待a.js加载,后续代码不能执行$.getScript(‘a.js‘,function(){  $.holdReady(false);     //释放,a.js加载完成,继续执行后续代码});

$.holdReady()函数表示 延迟加载。

时间: 2024-12-28 15:42:24

判断JS是否加载完成的相关文章

外部引入的js 判断js脚本加载是否完成,完成后执行 相应的动作(以引入百度地图js为例)

可以使用JQuery的 $.getScript(url,function(){});方法 $.getScript("http://api.map.baidu.com/getscript?v=1.1&ak=&services=true&t=",function(){ //获取百度地图js成功后 会执行此方法 initMap(); }); 这个方法等价于 $.ajax({ url: url, dataType: "script", success

如何判断js是否加载完全

var script=document.createElement('script'); if(script.onreadystatechange){ script.onreadystatechange=function(){ if(this.readyState==='loaded' || this.readyState==='complete'){ script.onreadystatechange=null; callback(); } } }else{ script.onload=fun

javascript异步延时加载及判断是否已加载js/css文件

引用就是某一变量(目标)的一个别名,对引用的操作与对变量直接操作完全一样. 引用的声明方法:类型标识符 &引用名=目标变量名: 例如: int a int &b=a; //定义引用b,它是变量a的引用,即别名 #include <stdio.h> void main() { int a = 123; int &b = a; printf("a=%d b=%d\n", a, b); } 执行结果: 实例:引用和变量的关系 #include <io

js判断网页是否加载完毕 包括图片

<script type="text/javascript" language="JavaScript"> //: 判断网页是否加载完成 document.onreadystatechange = function () { if(document.readyState=="complete") { document.getElementById('divprogressbar').style.display='none'; } }

js判断页面是否加载完成

1.javascript.jquery: 方法一: window.onload=function(){ } 方法二: //判断网页是否加载完成 document.onreadystatechange=function(){ if(document.readyState=="complete"){ document.getElementById('divpro').style.display='none' } } 方法三: ;(function($,undefined){ $(funct

JavaScript实现判断图片是否加载完成的3种方法整理

JavaScript实现判断图片是否加载完成的3种方法整理 有时候我们在前端开发工作中为了获取图片的信息,需要在图片加载完成后才可以正确的获取到图片的大小尺寸,并且执行相应的回调函数使图片产生某种显示效果.本文主要整理了几种常见的javascipt判断图片加载完成时的方法,并通过代码与实际应用相结合进行解释与说明. onload方法 通过向img标签添加onload属性,并填入相应的函数来执行后续的javascipt代码.如下代码例子中img元素默认是不显示的,通过onload判断加载完成后再将

document.readyState等属性,判断页面是否加载完

如何在页面加载完成后再去做某事?什么方法可以判断当前页面加载已完成?document.readyState 判断页面是否加载完成?javascript提供了document.readyState=="complete"方法来解决当前页面加载判断的问题. <script type="text/javascript">   function initView(){         if (document.readyState=="complete

纯js懒加载,java后台举例

? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 function getElementsByClassName(str,root,tag){        if(root){            root = type

JS 动态加载脚本 执行回调[transfer]

JS 动态加载脚本 执行回调 关于在javascript里面加载其它的js文件的问题可能很多人都遇到过,但很多朋友可能并不知道怎么判断我们要加载的js文件是否加载完成,如果没有加载完成我们就调用文件里面的函数是不会成功的.本文讲解怎么在js中加载其它js文件并在加载完成后执行回调函数. 我们可以动态的创建 <script> 元素,然后通过更改它的 src 属性来加载脚本,但是怎么知道这个脚本文件加载完成了呢,因为我们有些函数需要在脚本加载完成生效后才能开始执行. 经过对网络上资源的搜索,我发现