Jquery 获取 div 或其他元素的宽度与高度

原创已于 2023-09-05 09:38:25 修改 · 852 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #jquery

于 2020-02-02 15:38:48 首次发布

前端专栏收录该内容

5 篇文章

订阅专栏

本文详细解析了使用jQuery获取元素宽度和高度的方法，包括元素本身的宽高、包含padding和border的外框尺寸，以及加上margin的完整尺寸。通过具体代码示例，帮助读者深入理解不同属性之间的区别。

获取宽度

$('div').width(); //区块的本身宽度
$('div').outerWidth(); //区块的宽度+padding宽度+border宽度
$('div').outerWidth(true); //区块的宽度+padding宽度+border宽度+margin的宽度

获取高度

$('div').height(); //区块的本身高度
$('div').outerHeight(); //区块的高度+padding高度+border高度
$('div').outerHeight(true); //区块的高度+padding高度+border高度+margin的高度

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

ThankiFu

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

动态获取div的宽度2种办法

jieweiwujie的博客

11-09

1379

动态获取div的宽度2种办法

使用jQuery获取元素的高度

PixelNovaO的博客

09-23

366

请注意，上述代码中的链接指向了jQuery库的在线版本。你也可以下载jQuery库并将其存储在本地，然后使用相应的本地路径引入。请确保在使用上述代码之前，已经引入了jQuery库。希望这可以帮助你使用jQuery获取元素的高度！方法之外，jQuery还提供了其他一些用于获取元素尺寸的方法，如。方法返回元素的计算高度，包括内边距和边框，但不包括外边距。根据你的需求，选择适合的方法来获取元素的尺寸。要使用jQuery来获取元素的高度，可以使用。方法获取该元素的高度，并将其存储在。在上面的代码中，我们首先通过。

1 条评论您还未登录，请先登录后发表或查看评论

1 条评论

优快云-Ada助手 2023.09.06
是不是以后前端开发会越来越多写小程序？

【jQuery】获取元素高宽的三个方法和注意点

星光不问赶路人，时光不负有心人。

02-28

1625

目录方法一：使用 width() 和 height() 方法方法二：用 css() 方法方法三：用 innerWidth() 和 outWidth() 方法，以及 innerHeight() 和 outHeight() 方法计算元素高宽的方法总结： jQuery中获取元素高宽时还是有些地方需要注意的，省时间的话直接跳到底部总结。这是页面结构，就一个ID 为box 的div ...

jquery里面获取div区块的宽度与高度

soman的博客

10-09

6万+

获取宽度 $('div').width(); 获取：区块的本身宽度 $('div').outerWidth(); 获取：区块的宽度+padding宽度+border宽度 $('div').outerWidth(true); 获取：区块的宽度+padding宽度+border宽度+margin的宽度获取高度 $('div').heig

jquery获取div的宽度

qq_40002311的博客

07-10

2243

例如： <div id="divLen" style="padding-left:10px;margin-left:10px"></div> <script> //宽度 //只是获取内容的宽度 var contentWidth = $("#divLen"). width(); //获取内容和padding的宽度 var contentWithPadding = $("#divLen"). innerWidth(); //获取内容+padding+border

jquery实现动态改变div宽度和高度

10-24

这两个方法都允许我们获取或设置元素的宽度和高度。当我们传递一个参数给这两个方法时，它会设置元素的尺寸；而如果没有传递参数，它则会返回当前元素的宽度或高度。在文章中提供的HTML代码中，我们定义了一个div...

无法获取隐藏元素宽度和高度的解决方案

08-31

无法获取隐藏元素宽度和高度的解决方案在实际开发中，我们经常会遇到需要获取隐藏元素的宽高的情况，这里的隐藏元素是指display为none的元素。在默认情况下，获取隐藏元素的宽高是非常困难的，因为浏览器不会计算...

jquery如何获取元素的滚动条高度等实现代码

10-23

本篇文章将详细介绍如何使用jQuery来获取元素的滚动条高度以及其他相关实现代码。首先，要理解滚动条高度通常是指元素内容超出其可视区域的部分，可以通过`scrollTop()`方法获取。例如，`$(document).scrollTop()`...

jQuery简单获取DIV和A标签元素位置的方法

10-20

首先，要获取DIV元素的位置，我们可以使用jQuery的offset()方法。offset()方法能够获取元素相对于文档的偏移量，也就是元素左上角相对于文档的left和top值。例如，对于一个ID为"div_id"的DIV元素，可以通过以下代码...

jQuery设置指定网页元素宽度和高度的方法

10-24

在示例代码中，我们创建了一个按钮（`<button>`）和一个具有初始宽度和高度的div元素（`<div id="div1">`）。按钮的点击事件被绑定到一个函数，该函数在用户点击按钮时执行。这通过`$("button").click(function() { ...

jQuery获取与设置div的宽和高

ztnhnr的专栏

01-01

5746

前端页面开发时，通过jquery有两种方法获取与设置div的宽高：使用尺寸函数或使用css方法。一、获取宽和高 1.1 尺寸函数： width()获取宽度 height()获取高度 1.2 css方法： css("width")获取宽度 css("height")获取高度区别：尺寸函数返回的值为整型，而css获取的值为带px的字符串举例： <!DOCTYPEhtml> <htmllang...

js&jq：获取div的宽度、高度、屏幕距离方法总结

kxy5201314的博客

10-21

1万+

jq获取div的宽度 var content = $(‘div’). width(); //只是获取content宽度 var contentWithPadding = $(‘div’). innerWidth(); //获取content+padding的宽度 var withoutMargin = $(‘div’). outerWidth(); //获取content+padding+border的宽度 var full = $(‘div’). outerWidth(true)

jquery 获取 DIV的width

轻轻草原啊

06-07

182

jquery 获取 DIV的width的语句： $("#keleyi_com").width(); 其中keleyi_com为DIV的id。完整示例代码： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitio...

获取div的宽度和高度

weixin_44430893的博客

03-29

3028

获取div的宽度和高度 var width = $('#容器id').width();

Jquery获取div的宽度与高度

一颗松鼠

09-25

3万+

宽度 $('div').width(); 区块的本身宽度 $('div').outerWidth(); 区块的宽度+padding宽度+border宽度 $('div').outerWidth(true); 区块的宽度+padding宽度+border宽度+margin的宽度高度 $('div').height(); 区块的本身高度 $('div').outerHe...

jq获取div的高度

既认准这条路，又何必在意要走多久

06-20

1万+

//获取当前IDV的高度 function getHeight(ele){ $(ele).addClass("active_cat");//增加样式 alert($(ele).height()); } //获取当前div下面的子div的高度 function getChildH(ele){ $(ele).addClass("active_cat"); alert($(ele).

JS动态获取DIV的宽度和高度px！

tongtongsong的博客

01-14

4325

JS动态获取div的宽度: var o = document.getElementById("div"); var width= o.clientWidth||o.offsetWidth; console.log(width);JS动态获取div的高度同理： var o = document.getElementById("div"); var height= o.clientHeight||o.offsetHeight; console.log(height); ...

jquery获取元素高度