zoukankan      html  css  js  c++  java
  • jquery outerHeight方法 outerWidth方法

    以前写代码中,每当需要获取元素的实际“宽度”(这里的宽度是指元素宽度加上其边距)时,都需要用元素宽度加上margin值才行,今天发现一个叫outerWidth(options)的方法 ,很好用。完成了原来需要用一段来操作做的工作。

    下面是其简单介绍

    outerWidth(options)
    获取第一个匹配元素外部宽度(默认包括补白和边框)。
    此方法对可见和隐藏元素均有效。
    返回值:Integer
    参数:
    options(Boolean) : (false) 设置为 true 时,计算边距在内。
    示例:
    获取第一段落外部宽度。

    HTML 代码:
    <div>
    <div id="test" style="80px;margin:10px;"></div>
    </div>

    jQuery 代码:


    var w = $("#test").outerWidth(true);


    $("#test").html(w);

    结果:
    <div>
    <div id="test" style="80px;margin:10px;">100</div>
    </div>


    outerHeight(options)

    获取第一个匹配元素外部高度(默认包括补白和边框)。
    此方法对可见和隐藏元素均有效。
    返回值:Integer
    参数:
    options(Boolean) : (false) 设置为 true 时,计算边距在内。
    示例:
    获取第一段落外部高度。

    HTML 代码:

    <div>
    <div id="test" style="height:20px;margin:10px;"></div>
    </div>

    jQuery 代码:


    var h = $("#test").outerHeight(true);


    $("#test").html(h);

    结果:
    <div>
    <div id="test" style="height:20px;margin:10px;">40</div>
    </div>

    </div>

     
  • 相关阅读:
    .NET Core自定义TagHelper和使用Serilog
    .NET Core CSRF
    jq 获取表单全部数据
    Webuploader 简单图片上传 支持多图上传
    CF-1451 E Bitwise Queries 异或 交互题
    CF-1440C2 Binary Table (Hard Version) (构造,模拟)
    CF-1445 C
    ACM模板_axiomofchoice_extra
    Codeforces Round #678 (Div. 2) 题解 (A-E)
    Oracle数据同步
  • 原文地址:https://www.cnblogs.com/webqiand/p/4607942.html
Copyright © 2011-2022 走看看