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);
  };
}
时间: 2024-08-28 15:20:14

js获取图片高度的相关文章

jquery 页面加载时获取图片高度

$(function () { $(window).load(function(){ alert($('img').height()); }); }); jquery 页面加载时获取图片高度

JS 获取星期几的四种写法

今天是星期几的4种JS代码写法,有需要的朋友可以参考一下 第一种写法 复制代码代码如下: var str = "";  var week = new Date().getDay();  if (week == 0) {          str = "今天是星期日";  } else if (week == 1) {          str = "今天是星期一";  } else if (week == 2) {          str =

一个js获取数组下标的函数

或许,面试的时候,你可能会被问到怎么模拟字符串的indexOf()函数获取数组的下标,这里是个人实现的一个小函数,里面包含的知识点挺多的,假如是新手,看不懂的地方可以百度,这里就不做详细介绍了,当然,看不懂也可以给我留言,有空会回复你的. /* 获取数组元素的下标, 第一个参数为数组的元素,可为复合类型,但不能为函数和undefined,也不能为空 第二个参数,要从哪个位置向后查找, 负数为从后面位置查找,查找的方向依然是向后查找, 比如说-1,就是最后的位置向后查找,也就是只能和最后一个元素相

jQuery的height()和JavaScript的height总结,js获取屏幕高度

jquery的各种高度 首先来说一说$(document)和$(window),如下: $(document).height();//整个网页的高度 $(window).height();//浏览器可视窗口的高度 $(window).scrollTop();//浏览器可视窗口顶端距离网页顶端的高度(垂直偏移) 用一句话理解就是:当网页滚动条拉到最低端时, $(document).height() == $(window).height() + $(window).scrollTop(). 注意,

js获取星期几

<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>获得星期</title><script type="text/javascript">  var mydate=new Date();  var myddy=m

图片加载完成之前获取图片高度

在图片加载完成之前就获取到图片的高度和宽度,对于提高页面性能和交互有非常巨大的作用,相信大家也是明白的. 其实原理非常简单,利用的就是浏览器加载图片时的一个策略:当图片头部信息加载完成后,浏览器即获知了图片的大小,然后就会在页面上空出相应的区域来,然后再下载图片的剩余数据并且显示到之前空出的区域中. 所以我们要做的就是:不断的去问浏览器你得到高度信息了没有,问到之后就可以马上做相应的处理,而此时图片还没有下载完成. 反映到代码上就是: 之前我们是这样获取高度的: var img = new Im

JS获值

var json = []; $('#hdtj table').each(function(index){ json.push({ 'con_main':$(this).find('input[name=man]').val(), 'con_reduce_che ck':$(this).find('input[name=check1]').is(':checked'), 'con_give_check':$(this).find('input[name=check2]').is(':checke

如何用JS获取ASP.net中的textbox的值 js获不到text值

<tr>                        <td class="table_body" style="width: 10%" align="right">                            工作目标                        </td>                        <td class="table_none" st

js获取屏幕高度宽度

获取各种屏幕的宽度和高度Javascript: 网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网页可见区域宽: document.body.offsetWidth (包括边线的宽)网页可见区域高: document.body.offsetHeight (包括边线的高)网页正文全文宽: document.body.scrollWidth网页正文全文高: document.body.scrollHeight网