js 获取div 图片高度
使用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 图片高度的更多相关文章
- JS获取div高度的方法
有时在写页面时,需要获取一个div的高度.怎么才能获取呢?哈哈,先上结论.有两种方法. offsetHeight .clientHeight getComputedStyle offsetHeight ...
- js获取div基础元素
1.js获取div元素 clientHeight 获取对象的高度,不计算任何边距.边框.滚动条,但包括该对象的补白. clientLeft 获取 offsetLeft 属性和客户区域的实际左边之间的距 ...
- JS获取IMG图片高宽
前段时间在LJW写的touchslider.js轮播代码里添加自适应屏幕大小的功能时,遇到一个问题.不管用什么样的方法都无法获取到IMG标签的高宽,最后只有给图片定一个高宽的比例值:趁今天有空我就写了 ...
- 动态获取div的高度 随着窗口变化而变化
// 1.jq法 <script> var winHeight = $(window).height(); $("#show").css("height&qu ...
- 获取div的高度
1.获取div的文档总高度(必须DOM操作): var scrollHeight=document.getElementById("inner").scrollHeight; // ...
- js 获取 网页屏幕高度 窗口高度 元素高度 滚动高度
常用: JS 获取浏览器窗口大小 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 // 获取窗口宽度 if (window.innerWidth) winWidth = ...
- js获取div中的文本框数据
通过div得到div里的所有数据 大神的世界无需解释,当然不是说我,当我看到这些代码的时候我惊呆了! 这是一个工具方法js: js: /* * 获取指定对象下的所有input.textarea值 * ...
- js获取窗口滚动条高度、窗口可视范围高度、文档实际内容高度、滚动条离浏览器底部的高度
1.获取窗口可视范围的高度 //获取窗口可视范围的高度 function getClientHeight(){ var clientHeight=0; if(document.body.clientH ...
- js 怎样获取div 图片等的宽度,只要值,不要px
给你的div命名id=“abc”,js中用下面的语句就能获取到js的宽度并赋值给a a=document.all.abc.offsetWidth; 然后通过 alert(a); 就能弹出这个值来了.
随机推荐
- POJ 3468(树状数组的威力)
之前说过这是线段树的裸题,但是当看了http://kenby.iteye.com/blog/962159 这篇题解后我简直震惊了,竟然能如此巧妙地转化为用树状数组来处理,附上部分截图(最好还是进入原网 ...
- Android控件_使用TextView实现跑马灯效果
一.第一种方式: 通过TextView控件的自身属性实现(但是有缺点就是当多个TextView要实现这种效果的时候,只有第一个才有效果) 实现方法加上下面四个属性: android:singleLi ...
- Android_开发工具的下载和开发环境的搭建
一.Android开发工具的下载 Android开发者官网: http://developer.android.com/ Android开发工具:http://www.andro ...
- 闲谈--心态 (zhuan)
http://blog.csdn.net/marksinoberg/article/details/53261034 ***************************************** ...
- Linux命令(1) - 查看内存使用情况: free -hm
使用"free -hm"命令查看linux服务器的内存使用状况,其中-h表示人性化显示,-m表示将内存显示为M:
- 图像fft和wavelet变换矩阵和向量区别 dwt2和wavedec2联系
1. 对于小波变换,dwt2 :单级离散2维小波变换 wavedec2 :多级2-D小波分解 matlab中这两者联系是都能对图像进行小波分解,区别是dwt2是二维单尺度小波变换,只能对输入矩阵X一 ...
- samtools常用命令详解(转)
转自:samtools常用命令详解 samtools的说明文档:http://samtools.sourceforge.net/samtools.shtml samtools是一个用于操作sam和ba ...
- 【转】 C++中delete和delete[]的区别
一直对C++中的delete和delete[]的区别不甚了解,今天遇到了,上网查了一下,得出了结论.做个备份,以免丢失. C++告诉我们在回收用 new 分配的单个对象的内存空间的时候用 delete ...
- mathematics
二倍角公式 史济怀-数学分析1-2003-09-19_2.asx-在线播放-优酷网,视频高清在线观看http://v.youku.com/v_show/id_XMTMzMDU1MTgw.html 国立 ...
- 完美解决Informix的中文乱码问题
完美解决Informix的中文乱码问题 Informix是IBM旗下的一款数据库,要不是这个项目需要,估计这辈子我都不知道居然还有这么一款数据库.想来公司的项目遍布全国各地,各种部署环境各种应用场景 ...