Фактическая высота стола

Question

У меня есть обычная таблица html, расположенная внутри div. Ширина div составляет 70%, поэтому таблица также изменяется. Дело в том, что, когда он сжимается, есть некоторые перерывы в линиях, что делает таблицу «выше», чем div. Чтобы сделать функцию javascript, чтобы изменить размер шрифта для определенных таблиц tds, которые могут сломать строки, мне хотелось сравнить обе высоты таблицы и ее div.

Однако, с помощью JQuery-х .height() и .outerHeight() вернуть мне высоту они были назначены в CSS, а не их фактической высоты. Если бы я получил хотя бы высоту переполненной области, было бы здорово уже. Любые догадки о том, что попробовать?

PS: Я попробовал this метод, но он тоже не сработал.

EDIT: Здесь очень просто fiddle, так что вы понимаете, как он вложен.

Я ценю предложенные предложения, но они также не работали.

Answer 1

Свойства смещения относятся к самому элементу.

Попробуйте это:

document.getElementById('#table').offsetHeight; 

Вот некоторые документы на смещение значений: https://developer.mozilla.org/en-US/docs/Web/API/CSS_Object_Model/Determining_the_dimensions_of_elements.

По большей части это даст вам размеры пространства, которое снимается на экране. Если вы хотите, чтобы размеры включали переполнение, то размеры прокрутки, которые были предоставлены @NielsKeurentjes, будут такими, какие вы хотите.

Answer 2

scrollHeight, см. this example.

От MDN:

Element.scrollHeight атрибут только для чтения является измерение высоты содержимого элемента, в том числе содержание не видно на экране из-за переполнения. Значение scrollHeight равно минимальному clientHeight Элемент потребовал бы, чтобы соответствовать всему содержанию в точке зрения без использования вертикальной полосы прокрутки. Он включает в себя элемент заполнения , но не его маржу.