<script>

$(document).ready(function(){

    alert("height:"+$("#div").height());   //20px; height属性值

    alert("innerHeight:"+$("#div").innerHeight());//30px; height属性值+padding属性值*2

    alert("outerHeight:"+$("#div").outerHeight()); //34px;height属性值+(padding属性值+border属性值)*2

    alert("outerHeight(true):"+$("#div").outerHeight(true));//50px;height属性值+(padding属性值+border属性值+margin属性值)*2

});

</script>

</head>

<body>

    <div id="div" style="height: 20px;border: 2px solid;padding: 5px;margin: 8px;width: 20px;"></div>

</body>

当中height:高度

innerHeight:高度+补白（padding）

outerHeight：高度+补白+边框

outerHeight(true):高度+补白+边框+边距

height/innerHeight/outerHeight的更多相关文章

  1. Jquery中的 height(), innerHeight() outerHeight()区别

    jQuery中的 height innerHeight outerHeight区别 标准浏览器下: height:高度 innerHeight:高度+补白 outerHeight:高度+补白+边框,参 ...

  2. Jquery中的height(),innerHeight(),outerHeight()的区别

    前言 最近练习做弹窗,遇到height(),innerHeight(),outerHeight()的区别. 根据下面的盒模型来了解三者的区别. height():element的height; inn ...

  3. jquery 之height(),innerHeight(),outerHeight()方法区别详解

    在jQuery中,获取元素高度的函数有3个,它们分别是height(). innerHeight().outerHeight(). 与此相对应的是,获取元素宽度的函数也有3个,它们分别是width() ...

  4. jquery中innerheight outerHeight()与height()的区别

    1. .height() 获取匹配元素集合中的第一个元素的当前计算高度值 或 设置每一个匹配元素的高度值(带一个参数). 注意:1).css('height')和.height()之间的区别是后者返回 ...

  5. jQuery height() innerHeight() outerHight() width() innerWidth() outerWidth()源码解读

    在第二层each,传入的对象以height举例是这样的,{padding:innerHeight,content:height,"":outerHeight} 对它遍历调用func ...

  6. [DOM基础]offsetHeight,clientHeight,scrollHeight,innerHeight,outerHeight等属性的解释

    由于经常搞混这几个属性,所以查找资料总结一下,方便以后翻出来温习. 一.偏移量-以offset开头的 1.offsetHeight:元素在垂直方向上占用的空间大小,像素.包括元素的高度.可见的水平滚动 ...

  7. 用jquery写循环播放div -2

    前面所说的class html元素标签的写法也要有层次性, 这个层次性其实也就是常说的 css类写法要有一个"命名空间, 名字空间" "namespace" 在 ...

  8. jQuery--效果和遍历

    七.jQuery效果 (1)jQuery隐藏和显示 //隐藏 $("#hide").click(function(){ $("p").hide(1000); } ...

  9. 【jQuery】jQuery API 过 一 遍

    closest, parents <!DOCTYPE html> <html> <head> <meta charset="utf-8"& ...

随机推荐

  1. UI僵死分析

    原因剖析 UI僵死无非只是因为UI线程因繁忙而无法去接受用户的响应.详细说来内在原因有以下两个: 正常的业务代码写在UI线程中执行,业务代码的任务繁重导致UI线程无法分身去接受用户的界面输入 UI控件 ...

  2. windows phone (17) ManipulationDelta事件

    原文:windows phone (17) ManipulationDelta事件 ManipulationDelta事件会是在触摸位置发生变化是引发,比如可以根据用户在触摸屏中移动的位置,图片发生相 ...

  3. 【剑指offer】面试题26：复制的复杂链条

    def copyRandomList(self, head): if None == head: return None phead = head while phead: pnext = phead ...

  4. 点集配对问题（状态dp）

    给定n个点(n是偶数)使得两个点两两配对,最后总的距离和最小. 用是表示集合,那么dp[s]表示集合s配对后的最小距离和  , 状态转换方程为  表示集合中任意拿两个元素配对,然后转移为更小的两个集合 ...

  5. oracle迁移mysql数据库注意（转）

    oracle转mysql修改: 1. substr() substr( string , 0, 10) 这里测试 必须从 第一位获取 既是 substr(string , 1 , 10)2. to_c ...

  6. Easyui 异步树直接所有展开

    初始化异步树直接所有展开代码: $(function(){ $('#tt').tree({ url:'<%=request.getContextPath()%>/treeInit', li ...

  7. adapter pattern

    对象适配器 9.7 适配器模式总结 适配器模式将现有接口转化为客户类所期望的接口,实现了对现有类的复用,它是一种使用频率非常高的设计模式,在软件开发中得以广泛应用,在Spring等开源框架.驱动程序设 ...

  8. 让你的字ScrollView、ListView充分伸展

    android默认ScrollView.ListView在最顶部的下拉上拉时或底部,未与反弹效应,很僵,让你无法继续拖累,不比iOS至于能否反弹.个人觉得,iOS互动还是略胜一筹.因此,我们已经走在A ...

  9. Java Swing 绝对布局管理方法，null布局（转）

    首先把相关容器的布局方式设为 setLayout(null); 然后调用组件的  setBounds() 方法 设置button的位置为(100,100) 长宽分别为 60,25 jButton.se ...

  10. iOS 中client和server的 Web Service 网络通信 （2）

    在实际的应用开发过程中,同步请求的用户体验并非非常好:我们都知道.Apple是非常重视用户体验的.这一点也成为了行业的标杆,没实用户哪里来的好产品.所以用户体验是极其重要的.貌似废话有点多.接下来进入 ...