当获取div的宽度为“100%”想获取其具体的像素值px怎么办

最新推荐文章于 2023-08-07 09:57:17 发布
最新推荐文章于 2023-08-07 09:57:17 发布
阅读量1.1w 收藏 4
点赞数 4
分类专栏： 杂 HTML+Javascript+CSS
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_15167261/article/details/47358201
版权

平常的时候获取div的宽度方法：document.getElementById("divid").style.width;但是当div的宽度样式设置为百分号制的时候需要通过clientWidth来获取其宽度。如下

document.getElementById("divid").clientWidth;

可能黑客
关注
  • 4
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
jQuery 获取和设置元素的宽高
ivenqin的博客
08-10 4826
本节我们学习如何通过 jQuery 中提供的方法来获取或者设置元素的宽度和高度。 jQuery 中用于获取设置宽高的方法有如下所示： 方法 描述 width() 设置或返回元素的宽度 height() 设置或返回元素的高度 innerWidth() 返回元素的宽度，包括内边距 innerHeight() 返回元素的高度，包括内边距 outerWidth() 返回元素的宽度，包括内边距和边框 outerHeight() 返回元素的高度，包括内边距和边框 width()和
jquery获取div宽度的实现思路与代码
10-27
DIV的width宽度如何获取呢？接下来介绍使用jquery获取DIV的width宽度，感兴趣的朋友可以了解下的
js获取Html元素的实际宽度高度的方法
11-23
第一种情况就是宽高都写在样式表里，就比如#div1{width:120px;}。这中情况通过#div1.style.width拿不到宽度，而通过#div1.offsetWidth才可以获取到宽度。 第二种情况就是宽和高是写在行内中，比如style=”width:120px;”，这中情况通过上述2个方法都能拿到宽度。 小结，因为id.offsetWidth和id.offsetHeight无视样式写在样式表还是行内，所以我们获取元素宽和高的时候最好用这2个属性。注意如果不是写在行内style中的属性都不能通过id.style.atrr来获取。 现 在的前端制作很少直接把样式写style里了，都是写
原生JS获取元素的位置与尺寸
菜同学的博客
08-14 340
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Comp...
JS获取屏幕分辨率 及 窗口尺寸
最新发布
偏执
08-07 1315
要得到窗口的尺寸，对于不同的浏览器，需要使用不同的属性和方法：若要检测窗口的真实尺寸，在Netscape下需要使用Window的属性；Document对象的body属性对应HTML文档的标签。event.clientX+document.documentElement.scrollTop 相对文档的水平座标+垂直方向滚动的量。网页可见区域宽： document.body.offsetWidth (包括边线的宽)网页可见区域宽：document.body.offsetWidth (包括边线的宽)
div为100%宽度，获取div的宽高
笔芯君
01-18 3026
当样式写在css中，或许写页面时头部的宽度为100%，使用js获取宽度 用document.getElementById("top").style.width是无效的 有如下两种解决方法： 1、写在行列元素中eg： 2、用document.getElementById("top").offsetWidth;
js对div取值与赋值
weixin_43085797的博客
03-26 4880
因为JavaScript运行时，id=“test1” 的那个div元素可能还没解析和加载，js加载是有顺序的。只需把 js 整个搬到 后面即可。 还有一个特别容易犯的毛病，页面引入 jQuery ，如果其他 js 要使用，需要放在 jQuery 之后，否则不能使用。 <!DOCTYPE html> <html> <head> <meta cha...
设置div的width: 100%显示时，问题来了
少油少盐不要辣
04-14 1327
要设置div 100%显示，必须设置其上一级div的宽度或高度，否则无效。
js获取精确宽度/高度(带小数位像素)
张营的技术博客
11-09 1万+
问题：用jquery获取div等块级元素的宽高时不能精确获取，只能得到整数部分像素，不能获取小数位px。请看下面事故：<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"
div宽度设置width:100%后再设置padding或margin超出父元素的解决办法
12-14
本文介绍的是利用CSS3的新属性box-sizing，解决div宽度设置width:100%后再设置padding或margin超出父元素的问题，有需要的朋友们可以参考借鉴。 语法 box-sizing: content-box|border-box|inherit; 值一、content-...
JavaScript和JQuery获取DIV值的方法示例
10-20
主要介绍了JavaScript和JQuery获取DIV值的方法,结合具体实例形式对比分析了javascript与jQuery获取页面div元素值的实现技巧,需要的朋友可以参考下
javascript获取设置div的高度和宽度兼容任何浏览器
10-26
Javascript如何获取和设置div的高度和宽度，并且兼容任何浏览器，感兴趣的朋友不妨看看下面的代码或许有意想不到的收获
js不能获取隐藏的div的宽度只能先显示后获取
10-25
js不能获取隐藏div的的宽度，现在的办法是先将其显示出来，再获取其宽度，计算位置，下面的示例，大家可以参考下
html中select显示非option的文字:做下拉框的时候用这些文字当提示
热门推荐
qq_15167261的博客
07-11 4万+
在用select做下拉框的时候，往往在select标签左边的框里写一些提示，如“请选择年份等”，事例代码如下： 请选择年份 2010 2011 2011
js找出两个数组中的相同元素
qq_15167261的博客
09-23 2万+
之前在网上搜到的找出两个数组中的相同元素不对或者说是有缺陷，自己写了一个，适用于一般的数组，不包括数组元素含有对象的等一些情况。代码如下 //传入两个数组作为参数，寻找两个数组中的相同元素。 function  FilterData(a,b)         {   //循环判断数组a里的元素在b里面有没有，有的话就放入新建立的数组中             var result = ne
arcmap导出属性表excel打开乱码问题
qq_15167261的博客
05-30 2万+
先导出为.txt格式，然后用记事本打开后保存为.csv格式，然后用EXCEL打开.CSV的文件。
搜狗拼音输入法可以打出㎡(上标这种效果)
qq_15167261的博客
07-30 2万+
搜狗拼音输入法可以打出单位上标这种效果，在做项目的时候代码里面可以用,比如说面积单位“㎡” ，在搜狗拼音输入法设置（菜单）里面，选择表情符号--特殊符号--在搜索符号中输入“平方”就出来了，在网上搜的打出这种效果也可以不用这么麻烦，但是自己没有找到怎么用。
angular样式中使用calc计算宽高，calc中的某个变量怎么从ts中获取
03-26
在Angular中，可以通过绑定属性来从ts文件中获取变量，在计算宽高时使用calc()函数。 例如，在HTML模板中，可以使用以下代码来绑定一个变量： ``` <div [style.width]="calc(100% - {{ variable }}px)"> ... </div> ``` 其中，`variable`是在ts文件中定义的变量。在这个例子中，calc()函数用于计算宽度，从而使得这个div的宽度总是占满父元素的空间，同时减去一个固定的像素值。 类似地，我们还可以使用`[style.height]`绑定属性来计算高度，例如： ``` <div [style.height]="calc(100% - {{ variable }}px)"> ... </div> ``` 这将使这个div的高度总是占满父元素的空间，同时减去一个固定的像素值。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值