使用jquery获取网页中图片的高度其实很简单,有两种常用的方法都可以打到我们的目的

$("img").whith();(返回纯数字)
$("img").css("width");(返回字符串:数字+"px")

但是有时候会遇到返回0的情况,上面方法返回值竟然是0或者0px,很让人诧异

jquery有以下两种常用的jquery事件加载的方法

$(function(){});
window.onload=function(){}

第一个呢,是在DOM结构渲染完成以后调用的,这时候网页中一些资源还没有加载,比如图片等资源,但是DOM结构已经渲染成功了 
第二个呢,是在网页DOM结构渲染完成,而且资源已经加载成功以后调用的。

有没有感受出区别来呢,一个是在资源没有加载的时候调用的,一个是在资源加载结束,页面已经渲染之后调用的,所以当我们在$(function(){})调用$('img').width()的时候,由于图片还没有加载,所以这时候<img>标签的高度就是0,所以返回值就是0。但是当你用window.onload=function(){}调用的时候,图片已经加载出来了,所以这时候就能得到图片的高度。

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

  1. JS获取div高度的方法

    有时在写页面时,需要获取一个div的高度.怎么才能获取呢?哈哈,先上结论.有两种方法. offsetHeight .clientHeight getComputedStyle offsetHeight ...

  2. js获取div基础元素

    1.js获取div元素 clientHeight 获取对象的高度,不计算任何边距.边框.滚动条,但包括该对象的补白. clientLeft 获取 offsetLeft 属性和客户区域的实际左边之间的距 ...

  3. JS获取IMG图片高宽

    前段时间在LJW写的touchslider.js轮播代码里添加自适应屏幕大小的功能时,遇到一个问题.不管用什么样的方法都无法获取到IMG标签的高宽,最后只有给图片定一个高宽的比例值:趁今天有空我就写了 ...

  4. 动态获取div的高度 随着窗口变化而变化

    // 1.jq法 <script> var winHeight = $(window).height(); $("#show").css("height&qu ...

  5. 获取div的高度

    1.获取div的文档总高度(必须DOM操作): var scrollHeight=document.getElementById("inner").scrollHeight; // ...

  6. js 获取 网页屏幕高度 窗口高度 元素高度 滚动高度

    常用: JS 获取浏览器窗口大小 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 // 获取窗口宽度 if (window.innerWidth) winWidth = ...

  7. js获取div中的文本框数据

    通过div得到div里的所有数据 大神的世界无需解释,当然不是说我,当我看到这些代码的时候我惊呆了! 这是一个工具方法js: js: /* * 获取指定对象下的所有input.textarea值 * ...

  8. js获取窗口滚动条高度、窗口可视范围高度、文档实际内容高度、滚动条离浏览器底部的高度

    1.获取窗口可视范围的高度 //获取窗口可视范围的高度 function getClientHeight(){ var clientHeight=0; if(document.body.clientH ...

  9. js 怎样获取div 图片等的宽度,只要值,不要px

    给你的div命名id=“abc”,js中用下面的语句就能获取到js的宽度并赋值给a a=document.all.abc.offsetWidth; 然后通过 alert(a); 就能弹出这个值来了.

随机推荐

  1. 无限极分类,传递一个子ID得到所有父集,用于在前台分层显示标题

    方法: static public function getParents($data,$id){ $arr=array(); foreach ($data as $v) { if ($v['id'] ...

  2. Python类、模块、包的区别

    类 类的概念在许多语言中出现,很容易理解.它将数据和操作进行封装,以便将来的复用. 模块 模块,在Python可理解为对应于一个文件.在创建了一个脚本文件后,定义了某些函数和变量.你在其他需要这些功能 ...

  3. JavaSE复习_7 异常

    △子父类涉及的异常问题:      1.子类在覆盖方法时,父类的方法如果抛出了异常,那么子类的方法只能抛出父类的异常或者该异常的子类,且只能抛出异常的子集      2.如果父类抛出了多个异常,子类只 ...

  4. (五)stm32工程代码HardFault异常查错调试方法

    一.导致异常的原因很多,例如:直接使用未分配空间的指针.栈溢出等一场非法操作便会使程序进入HardFault异常状态.下面介绍怎么找出程序中的异常. 接下来在keil_MDK工程中,编译代码,并deb ...

  5. 注意字段类型是varchar2的时候是需要加长度的

    注意字段类型是varchar2的时候是需要加长度的,如下: alter table a add username varchar2(32); 注意以下是错误的: alter table a add u ...

  6. 使用soapui调用webservice接口

    soapui是专门模拟调用webservice接口的工具,下面介绍下怎么使用: 1.下载soapui并安装: 2.以免费天气获取接口为例:http://www.webservicex.net/glob ...

  7. ORACLE CentOS5.6安装

    1 准备 CentOS 5.6企业版 oracle11g fs 安装.安装环境为vmware虚拟机.另外,本安装文档非常简洁,但关键步骤都指出来了,其他的都是默认选择,遇到不知该如何选择的操作或者问题 ...

  8. SVN使用报错 Synchronize operation failed. RA layer request failed svn: REPORT request on

    使用SVN同步项目时报错 RA layer request failed svn 百度了下解决方法: 删除C:\Documents and Settings\用户名\Application Data\ ...

  9. ie6 span 换行IE6中float:right换行问题的替代解决方案

    在IE6,IE7下使用<span>标签时,在加入右浮动样式后,会换行的bug解决方案: bug案例:新闻列表中,为使时间右对齐,加右浮动产生换行 <ul> <li> ...

  10. 程序猿必知会的JavaScript 的遍历方式

    不管是移动移动端开发还是web端开发,我们对JS的使用频率都在增加,今天小编将要和大家分享的就是JavaScript中,遍历方式的一些实现方法,个人感觉还是很有用的,有兴趣的童鞋可以一起来看看. 为了 ...