首页 > 其他 > 详细

页面加载完就执行的设置?

时间:2018-05-08 17:10:01      阅读:308      评论:0      收藏:0      [点我收藏+]

在JS中,如果希望在页面加载完成后执行某些操作的话,一般的写法如下:

window.onload = function(){// some thing to do};

但 是,onload函数的执行并不是我们通常所理解的浏览器构建完html页面对应的DOM树后立刻执行,而是要等到页面中所引用的图片等外部资源 完全下载完成后并且在浏览器中显示才执行,也就是说,如果页面中包括很多图片或者图片很大时将导致onload函数执行时间会被推迟很久,页面中基于 onload的特效或者其它相关内容将并不立刻可用,导致用户体验差。JQUERY的提供了一个自己的类似onload方式,通过该方法实现的页面加载后 执行函数将在浏览器构建完DOM树后立刻执行,而并不需要等待图片等外部资源下载完成。

可以在body标签中设置onload="init()"

并引入js代码:

<script>
var canvas, stage, exportRoot;

function init() {
createjs.MotionGuidePlugin.install();

canvas = document.getElementById("canvas");
images = images||{};

var loader = new createjs.LoadQueue(false);
loader.addEventListener("fileload", handleFileLoad);
loader.addEventListener("complete", handleComplete);
loader.loadManifest(lib.properties.manifest);
}

function handleFileLoad(evt) {
if (evt.item.type == "image") { images[evt.item.id] = evt.result; }
}

function handleComplete() {
exportRoot = new lib.flower();

stage = new createjs.Stage(canvas);
stage.addChild(exportRoot);
stage.update();

createjs.Ticker.setFPS(lib.properties.fps);
createjs.Ticker.addEventListener("tick", stage);
}
</script>

页面加载完就执行的设置?

原文:https://www.cnblogs.com/duanzhange/p/9009292.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!