js获取图片高度
js获取图片高度时经常会获取的图片高度为0,原因是图片未加载完毕。第一次加载时,显示0(火狐等部分浏览器显示24)。待加载完毕后,再刷新,显示图片高度258。
var oImg = document.createElement("img");
oImg.src = "http:////www.baidu.com/img/bdlogo.png";
document.getElementsByTagName("body")[0].appendChild(oImg);
console.log(oImg.height);
onload可以避免这种问题。
oImg.onload = function(){
console.log(this.height);
};
jquery有类似方法。
$(oImg).load(function(){
console.log($(this).height());
});
浏览器加载图片只加载一次,第二次则读取缓存。onload事件只在第一次加载过程中触发。如果我们无论图片是否存在缓存中都在图片加载完毕后执行某语句,则可利用img的complete属性。complete为true时,表示图片存在于缓存中。
if(oImg.complete){
console.log(oImg.height);
}else{
oImg.onload = function(){
console.log(this.height);
};
}
js获取图片高度的更多相关文章
- 为什么js获取图片高度的值 都为0
尼玛 这个问题困扰我好久~ 看别人取值都是 img.width 我取到的总是0: 终于发现取图片尺寸的时候 图片还没有加载完毕.所以在 <img id ='sImg' class='thumbI ...
- JS Img对象获取图片高度宽度(兼容Chrome)
一般获取图片高度宽度的写法: var img = new Image();img.src = imgsrc;var imgWH = CalcImgTiple(img.width, img.height ...
- jquery的height()和javascript的height总结,js获取屏幕高度
jquery的height()和javascript的height总结,js获取屏幕高度 2014年9月18日 15048次浏览 引子 今天是九一八事变八十三周年,大家勿忘国耻!加油学习!经济和技术等 ...
- JS获取屏幕高度
主要使用了document对象关于窗口的一些属性,这些属性的主要功能和用法如下. 要 得到窗口的尺寸,对于不同的浏览器,需要使用不同的属性和方法:若要检测窗口的真实尺寸,在netscape下需要使用w ...
- JS 获取星期几的四种写法
今天是星期几的4种JS代码写法,有需要的朋友可以参考一下 第一种写法 复制代码代码如下: var str = ""; var week = new Date().getDay() ...
- jquery easyui datagrid js获取记录数 页数 当前页
首先要吐槽的是 easyui竟然找不到未压缩的版本(1 也许它是藏在某个个几角旮旯; 2 压缩的版本想看懂? 大概你得在你脑袋上外接个CPU), 而且官方的文档简陋的不能再简陋了, 想实现个稍微复杂点 ...
- JS获当前网页元素高度offsetHeight
本文测试的是offsetHeight,获取网页中某元素的高度,单位是像素,获取的类型是整型,可以进行数字运算.如图,网页中的元素本身的高度包括,自身的内容+padding+border,而margin ...
- JS获取屏幕高度(转)
IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.d ...
- jquery 页面加载时获取图片高度
$(function () { $(window).load(function(){ alert($('img').height()); }); });
随机推荐
- Zlib压缩算法在Java与Delphi间交互实现(压缩XML交互)
一个典型应用中,使用delphi作为客户端,J2EE服务端,两者之间用XML作为数据交换,为了提高效率,对XML数据进行压缩,为此需要找到一种压缩/解压算法能够两个平台之间交互处理,使用ZLIB算法就 ...
- Java:多线程,线程池,使用CompletionService通过Future来处理Callable的返回结果
1. 背景 在Java5的多线程中,可以使用Callable接口来实现具有返回值的线程.使用线程池的submit方法提交Callable任务,利用submit方法返回的Future存根,调用此存根的g ...
- 根据SimpleScheduleBuilder配置不同的SimpleTrigger触发器
Job代码: [java] view plaincopy package cn.zto.job; import java.text.SimpleDateFormat; import java.ut ...
- Windows 8 关闭无线后无法打开WIFI的解决办法
转:http://blog.sina.com.cn/s/blog_49d02ed101016b4n.html 在使用 Windows 8 的过程中,遇到过几次使用键盘上的功能键(笔者笔记本上的快捷键是 ...
- HDU-4972 A simple dynamic programming problem
http://acm.hdu.edu.cn/showproblem.php?pid=4972 ++和+1还是有区别的,不可大意. A simple dynamic programming proble ...
- C#中的四舍五入算法
最近在产品开发过程中遇到一个问题,就是在对数值进行截取,例如说保留两位小数时,最终得到的结果跟预期的在某些情况下会产生差异,这个差异的表现就是最后一位与预期的不一致,也就是说在"四舍五入&q ...
- pm grant 命令
CustomLocale.apk所需要的权限"android.permission.CHANGE_CONFIGURATION"自Android 4.2,4.2.2起系统定义为and ...
- 解决外部机器通过VM内ubuntu IP 无法访问vm内web服务的问题
1. 2.i root@ubuntu:/home/udapeng# ifconfig root@ubuntu:/www/sentry# nano uwsgi.ini root@ubuntu:/www/ ...
- php将SQL查询结果赋值给变量
2012-03-25 12:12 a786013819 | 分类:数据库DB | 浏览1393次 $sql = "select field1 from pre_common_member_p ...
- spring maven pom
https://spring.io/blog/2009/12/02/obtaining-spring-3-artifacts-with-maven/