<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. windows下cocos2dx3.0开发环境及Android编译环境搭建

    cocos2dx更新到了3.x版本号,自己一直没有换,如今开发组要求统一换版本号,我就把搭建好开发环境的过程记录下来. 一.Windowns下开发环境搭建 1.  所需工具         1)coc ...

  2. 状态压缩dp入门

    poj1321 http://poj.org/problem?id=1321 我们可以把棋盘的每一行看做是一个状态,如果某一列放置了棋子,那么就标记为1,否则就标记为0.然后把它看成是一个二进制数,然 ...

  3. 基于Cocos2dx开发卡牌游戏_松开，这三个国家

    1.它实现了动态读取地图资源.地图信息被记录excel桌格.假设你想添加地图,编者excel导入后CocoStudio数据编辑器,然后出口到Json档,到项目的Resource文件夹下. 2.SGFi ...

  4. SQL Tuning Advisor一个错误ORA-00600: internal error code, arguments: [kesqsMakeBindValue:obj]

    跑SELECT dbms_sqltune.report_tuning_task(:tuning_task) FROM dual;  错误消息,如下面: ORA-00600: internal erro ...

  5. 如何：使用 Visual Studio 中的一键式发布来部署 Web 应用程序项目

    原文: 如何:使用 Visual Studio 中的一键式发布来部署 Web 应用程序项目 本主题介绍如何在以下产品中使用 一键式发布 发布(部署)Web 应用程序项目: Visual Studio ...

  6. MVC过滤器的详细讲解和示范样本

    MVC共有4个过滤器:ActionFilter(方法过滤器),ResultFilter(结果过滤器.感觉是不是很好,所以称它为),AuthorizationFilter(授权过滤器).Exceptio ...

  7. Android动画之二：View Animation

    作为一个博客<Android其中的动画:Drawable Animation>.android动画主要分为三大部分.上一篇博客已经解说Drawable Animation的使用方法,即逐帧 ...

  8. gif动图快速制作方法（附工具）(转)

    现在写博客或是wiki的过程中,会经常引用到图片,特别是客户端经常与页面相关所以截图不可避.但是越来越多的效果仅仅一张图片是无法清楚的描述.并且博客或是wiki也是支持gif图的.gif图的制作方法有 ...

  9. Codeforces Round #256 (Div. 2) D. Multiplication Table 二分法

     D. Multiplication Table time limit per test 1 second memory limit per test 256 megabytes input st ...

  10. RunJS推荐用于个人使用（使用方便JS、css实时预览、编辑、管理等功能）

    RunJS,在线编写.展示html.js.css代码,拥有实时预览.分享.Fork.代码高亮.自己主动完毕等多项特性,提供文件上传.多种登录方式. 地址:http://runjs.cn/ waterm ...