<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title></title>

    <script src="../../jq-practice/jq/jquery-2.2.1.min.js"></script>

    <script>

        $(function(){

            alert($('div').width());          //width

            alert($('div').innerWidth());      //width+padding

            alert($('div').outerWidth());      //width+padding+border

            alert($('div').outerWidth(true));     //width+padding+border+margin

        });

    </script>

</head>

<body>

<div style="width: 100px; height: 100px; padding: 10px; border: 4px solid red; margin: 5px; background: blue;" ></div>

</body>

</html>

jQuery—一些常见方法（3）【width(),innerWidth(),outerWidth()】的更多相关文章

  1. jQuery中【width(),innerWidth(),outerWidth()】

    这个问题,已经别扭我多年了,今天终于彻底解决了,拿出来庆贺一下.jquery作为开源项目,无论从思路上,还是从严谨性上,让人崇敬. 随着时间的流逝,jquery的一些功能被逐渐挖掘出来.通过jQuer ...

  2. jquery width(), innerWidth(), outerWidth() 区别

    #div1 { width: 100px; height: 100px; border: 5px black solid; padding: 10px; margin: 10px; backgroun ...

  3. jQuery中的width() innerWidth() outerWidth() outerWidth(true)的区别

    width()仅仅包括content(内容) innerWidth()包括content(内容)和padding(补白) outerWidth()包括content(内容),padding(补白)和b ...

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

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

  5. jQuery—一些常见方法（1）【filter(),not(),has(),next(),prev(),find(),eq(),index(),attr(),】

    1.filter()和not()方法 filter()和not()是一对反方法,filter()是过滤. filter()方法是针对元素自身.(跟has()方法有区别) <script type ...

  6. jQuery—一些常见方法（2）DOM操作【insertBefore(),insertAfter(),appendTo(),prependTo(),before(),after(),append(),prepend(),remove(),on(),off(),scrollTop()】

    一.insertBefore() 如下代码:找到span标签,将span标签剪切到div的前面 <!DOCTYPE html> <html lang="en"&g ...

  7. width() innerwidth() outerwidth() css('width')

    不多说,用一图足以说明 首先先解释下普通元素和非普通元素, 非普通元素是指window,document这些 元素对象, 普通元素是指除window,document之外的元素,如:div 对于普通的 ...

  8. innerWidth outerWidth

    在jQuery中: 一.width()方法用于获得元素宽度: 二.innerWidth()方法用于获得包括内边界(padding)的元素宽度; 三.outerWidth()方法用于获得包括内边界(pa ...

  9. jQuery ajax调用后台aspx后台文件的两种常见方法(不是ashx)

    在asp.net webForm开发中,用Jquery ajax调用aspx页面的方法常用的有两种:下面我来简单介绍一下. [WebMethod] public static string SayHe ...

随机推荐

  1. 【转】二叉树 VS hashtable

    hash_table和二叉搜索树都经常被用来构建符号表(或者字典)以及相关的结构,并且他们都表现出了很高的效率.最近也在不同的程序中使用了这两种数据结构,实现完毕后思考一下,对两者做了一个简单的比较: ...

  2. hdu 5480 Conturbatio 线段树 单点更新，区间查询最小值

    Conturbatio Time Limit: 1 Sec Memory Limit: 256 MB 题目连接 http://acm.hdu.edu.cn/showproblem.php?pid=54 ...

  3. JS知识点备忘

    做前端久了,会发现很多比较杂的知识点,平时很少用到(往往在面试的时候经常见到),但是遇到的时候会很揪心...所以遇到的时候把它记录下来,但求有个印象,再次遇到时,可以在这里快速找到解决. 1.文档碎片 ...

  4. js操作json添加元素和数据的方法

    function addServerUrlToJson() { var json_tem = [{"name":"a","value":1} ...

  5. python无私有成员变量

    python解释器将__init__函数里的__z变量转成 _classname__z了,明确规则后外部依旧能够通过实力对象来訪问. In [1]: class aa: ...: def __init ...

  6. php实用函数整理

    1. 排序:array_multisort 可以对多位数组的多个字段进行排序 例子1如下: //自定义数组排序--按转发数从高到低排序 function sortSelfRc($oneLayer){ ...

  7. hdu 3732 Ahui Writes Word

    这是一道背包题,当你题读完了的时候,你会觉得这道题明明就是01背包的完全版吗! no no no no no no  no no  no no no~~~~~~~~~~~~~~~~~~~~~~~~~~ ...

  8. Helpers\Date

    Helpers\Date The Date helper is used for calculations with dates. Date::difference($from, $to, $type ...

  9. [转帖]2010.10.7google北大笔试题回忆

    1.1关于IP协议那个正确 A IP是TCP上层协议B IP协议是应用层协议C由于两个属于同一层协议,他们之间可以直接通信DIP协议不提供可靠的通信 1.2 关于内存正确的是 A内存的存取速度不能低于 ...

  10. Java基础知识强化之多线程笔记05：Java程序运行原理 和 JVM的启动是多线程的吗

    1. Java程序运行原理:     Java 命令会启动Java 虚拟机,启动 JVM,等于启动了一个应用程序,也就是启动了一个进程.该进程会自动启动一个 “主线程” ,然后主线程去调用某个类的 m ...