问题标签 [offsetheight]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
0 回答
147 浏览

javascript - 减少包含的文本字体时如何重置DIV offsetHeight

我有一个<div>用于确定任意文本字符串所需的垂直空间。默认情况下,<div>框的高度会增长以适应文本,包括换行等。

如果我增加包含文本的字体大小,<div>高度将根据需要很好地增长。

然而,不是另一个方向。如果我减小字体大小,则<div>offsetHeight 会保持高水位线值。

至少对于 Firefox 和 Chrome 来说是这样。

是否有强制浏览器向下调整的策略?

0 投票
1 回答
1204 浏览

javascript - Html 正文样式“padding-top”在 Firefox 中不起作用

为什么当我在做:

"padding-top"Firefox 中不起作用?在 Chrome 和 IE 中没问题,但 FF - 在后面刺伤。

整个代码是:

在这里看到它:http: //plnkr.co/edit/KyxxRV ?p=preview

UPD:刚刚发现可行style.paddingTop 但有什么问题"padding-top"

0 投票
1 回答
403 浏览

css - 添加 1px 填充会导致外部 div 包含子边距

当 div 的子元素包含边距时,这些边距不包括在div.offsetHeight. 但是,当您对父 div 执行某些操作时除外,包括给它 1px 的填充。

下面的代码导致报告的 div 高度从 38px 跳到 83px(“正确”大小,包括子边距)。为元素添加边框具有相同的效果。

这里发生了什么?这是定义的行为吗?另外,如果没有这个 1px hack,是否有办法获得元素的实际高度(包括子边距,但不是它自己的边距)?

(这个问题的上下文是我在调整窗口大小时调整了 iframe 的大小,并且只有在包含 1px 填充时计算才能正常工作。)

JSFiddle

0 投票
2 回答
1406 浏览

javascript - JavaScript - 如果使用 .offsetHeight 的语句不起作用

我是 JavaScript 新手,正在练习。我正在尝试显示类名为“test”的 div 中 h1 和 p 元素的组合高度。我查了各种各样的东西,觉得我真的很接近,但不能完全让它发挥作用。有谁能帮忙吗?

HTML:

JavaScript:

0 投票
2 回答
264 浏览

javascript - 获取元素的 offsetHeight 有副作用吗?

在 Bootstrap 崩溃的代码中,在hide()方法中,我看到以下行:

this.$element[dimension](this.$element[dimension]())[0].offsetHeight

我不明白.offsetHeight结尾的意义是什么,除非它有副作用,因为它没有被分配给任何东西。它有副作用吗?

0 投票
1 回答
405 浏览

javascript - 当标准投诉模式未打开时,表行/TR 的 offsetHeight 似乎在 IE11 中给出了不同的值。这是IE11中的错误吗?

我有 2 个具有相同行数的表并排保存,以实现固定第一列(左侧第一个表)和可水平滚动的其余列(右侧第二个表)的要求。在加载时,根据这些表格行高中的内容 [label、image、textArea & etc] 大小正在调整为左右对齐。

这是通过将行的更高值 offsetHeight 与同一表行和其他表行的 style.height 进行比较和分配来实现的。

这在 IE6 到 IE10 中工作了很多年,在 IE11 中我们开始看到未对齐问题。我仍然没有转向标准投诉[仍然 IE8 兼容性]。

进一步的研究和以下类似表明的 offsetHeight 计算会有所不同。 https://msdn.microsoft.com/en-us/library/ms534199(v=vs.85).aspx

所以我必须将代码更改为下面并在我的本地机器 IE11/Windows 8 中修复问题。x.rows[i].style.height = y.rows[i].style.height = x.rows[i]。偏移高度;

但是,VDI [虚拟桌面基础架构] 机器 IE11 中仍然存在问题。我打算尝试使用 clientHeight 而不是 offsetHeight。我还需要尝试/寻找什么来解决这个问题?

注意:上面的代码只是解释问题的示例,在实际查找和分配行的高度时,将其分离到不同的循环中,以避免回流(提高响应时间)。

0 投票
1 回答
244 浏览

css - 为什么除非父级有边框,否则父级的 offsetHeight 会忽略其子级的边距?

1)在简单的父子关系中,内在的孩子一般会影响outerHeight父母的:

outer1.offsetHeight == 18

2)如果给了内部孩子 a margin,父母的outerHeight不会改变:

outer2.offsetHeight == 18

3)如果然后给父母 a border,那么它确实考虑了孩子的margin

outer3.offsetHeight == 30

我想outerHeight测量它的高度,包括它的边界。为什么它包括孩子的边距,但前提是父母有边框?

0 投票
0 回答
102 浏览

html - offsetHeight 在标准模式和怪癖模式下返回不同的结果

嗨,我对 CSS 很陌生。

我有这个以 IE 11 标准模式呈现的简单 html 页面:

这个 HTML 有 2 个 div 元素。页面底部的 JavaScript 获得 2 个 div 的偏移高度。第一个 Div 偏移高度为:18 第二个 Div 偏移高度为:14

如果我在 Quirks 模式下呈现相同的 HTML。我得到不同的结果:

第一个 Div 偏移高度为:19 第二个 Div 偏移高度为:19

我想在标准模式下(即不添加元标记)从怪癖模式获得偏移高度。可能是通过CSS。让我知道是否可能?

0 投票
2 回答
1305 浏览

javascript - Javascript元素offsetHeight在for循环中返回返回0

我正在尝试动态获取三列网格内子元素的高度。

i等于 2 或i大于 1 时(即当循环内至少有 2 个元素时),offsetHeight正确返回渲染高度(我在专用元素中显示渲染高度值以$('#testheight')进行检查。)

但是,当i等于 1 时,offsetHeight返回 0,即使呈现的元素具有高度(<img>通过 PHP 在子元素内部呈现了一个元素)。

我找不到错误!请帮忙!

0 投票
1 回答
1081 浏览

angular - Angular 2:尝试使用 ElementRef 访问组件高度时的奇怪行为

我正在尝试在 Angular2 中创建一个图像滑块,如下所示。

在我的滑块组件中,我希望能够获取每张幻灯片的高度,因此我使用 @ContentChildren 来获取滑块中的幻灯片列表,并且还将 ElementRef 导入到幻灯片组件中,以便访问 nativeElement 属性.

在 ngAfterViewInit() 函数中,我能够成功 console.log(slide.el),它显示了两个 ElementRef 对象。当我手动单击它一直到属性时,我看到 clientHeight 是 303 px(查看控制台输出)。

现在出现了奇怪的部分......当我使用 console.log(slide.el.nativeElement.clientHeight) 时,突然之间,我看到了一个不同的且完全不正确的数字(查看控制台输出)。对于我的一生,我无法弄清楚为什么会出现这种情况以及如何访问正确的高度值。

滑块组件.ts

幻灯片组件.ts