<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. JDBC连接数据库经验技巧（转）

    Java数据库连接(JDBC)由一组用 Java 编程语言编写的类和接口组成.JDBC 为工具/数据库开发人员提供了一个标准的 API,使他们能够用纯Java API 来编写数据库应用程序.然而各个开 ...

  2. Oracle SQL Lesson (1) - 使用SQL Select语句获取数据

    第一节课: 启动数据库并且使用特定用户连接:su - oracle; 启动sqlplus并且使用sys连接:conn / as sysdba; 启动数据库:startup; 解锁用户:alter us ...

  3. 设计模式10---设计模式之原型模式（Prototype）

    1.场景模式 考虑这样一个实际应用:订单处理系统 里面有一个保存订单的功能,当产品数量超过1000份以后,拆成两份订单,再超,那么就再拆.直到每份订单不超过1000为止,订单有两种,一个是个人订单,一 ...

  4. UVA 11427 - Expect the Expected(概率递归预期)

    UVA 11427 - Expect the Expected 题目链接 题意:玩一个游戏.赢的概率p,一个晚上能玩n盘,假设n盘都没赢到总赢的盘数比例大于等于p.以后都不再玩了,假设有到p就结束 思 ...

  5. 8 shell命令之find

    find命令,像cd一样经常使用.只是可能大多数时间仅仅要那么一两个參数就足够使用了.或者说,勉强够用了.可是当我们主动的去翻看一下find的手冊,会发现原来更实用的功能都没实用到. 本文结合自己的使 ...

  6. 领域驱动设计（DDD）部分核心概念的个人理解（转）

    领域驱动设计(DDD)是一种基于模型驱动的软件设计方式.它以领域为核心,分析领域中的问题,通过建立一个领域模型来有效的解决领域中的核心的复杂问题.Eric Ivans为领域驱动设计提出了大量的最佳实践 ...

  7. 同一路由器不同vlan之间的通信（一）

    还是废话不多说,第一步,看拓扑图. 先把pc上的ip都配好.開始设置 switch0: >en >conf t >vlan 2 >exit >int fa 0/1 > ...

  8. javascript于boolean类型转换，运营商&amp;&amp;和|| 返回值

    javascript它是弱类型语言,不管是什么类型的数据可以被转换成boolean种类.转换规则如下面的: 数据类型                 转换为boolean后的值 NAN         ...

  9. play framework2.5.

    play framework2 的学习笔记 https://github.com/playframework/playframework https://github.com/playframewor ...

  10. Swift String length property

    Swift的String居然没有length属性,好难受,每次要获取String的字符串长度都要借助全局函数countElements. 没办法.仅仅有扩展String结构体,给它加入一个属性了. i ...