手记

在onload事件前获取图片的宽高

有时候在获取从后台的图片时,要对图片进行一系列的处理,才渲染出来我们要解决的是没有缓存而又快速的相比onload更快的方式去获取图片的宽高,接下来上代码通过定时循环检测获取:
// 记录当前时间戳var start_time = new Date().getTime()// 图片地址 后面加时间戳是为了避免缓存 var cutSrc = window.ctx + '/touchsys/terminal/showCapture?terminalId=' + terminalId + '×trap=' + Math.random();// 创建对象var img = new Image()// 改变图片的src img.src = cutSrc;// 定时执行获取宽高var check = function(){ // 只要任何一方大于0 // 表示已经服务器已经返回宽高    if (img.width>0 || img.height>0) {        var diff = new Date().getTime() - start_time;        document.body.innerHTML += '        from:check : width:'+img.width+',height:'+img.height+', time:'+diff+'ms';        clearInterval(set);    }}var set = setInterval(check,40)// 加载完成获取宽高img.onload = function(){    var diff = new Date().getTime() - start_time;    document.body.innerHTML += 'from:onload : width:'+img.width+',height:'+img.height+', time:'+diff+'ms';        //在里面在做一些我们想处理的逻辑};

0人推荐
随时随地看视频
慕课网APP

相关阅读

程序员的江湖梦