Высота jquery () в <td> с Internet Exporer
У меня проблема с получением правильной высоты (используя.height() с jquery 3) элемента td в Internet Exporer 11 / Edge.
$('#h1').text($('#cell').height());
$('#h2').text($('#cell').outerHeight());
$('#h3').text($('#cell')[0].clientHeight);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<table>
<tr>
<td id="cell" style="height: 100px; border: 1px solid red;">
foo
</td>
</tr>
</table>
<hr>
<pre>
$('#cell').height(): <span id="h1"></span>
$('#cell').outerHeight(): <span id="h2"></span>
$('#cell')[0].clientHeight: <span id="h3"></span>
</pre>
Результат в chome, как я и ожидал:
$('#cell').height(): 100
$('#cell').outerHeight(): 104
$('#cell')[0].clientHeight: 102
Но в IE я получаю:
$('#cell').height(): 18.4
$('#cell').outerHeight(): 22.4
$('#cell')[0].clientHeight: 98
Конечно, есть обходные пути, но я хочу понять, что здесь происходит. Какова идея этих чисел и в каких случаях.height() вернет их? Jquery 1.x и 2.x служат моим ожидаемым результатом, как Chrome с 3.x. До сих пор я смог воспроизвести его только с td-элементами.
1 ответ
Я считаю, что это известная ошибка, которая (по-видимому) не исправлена.
Смотрите: https://github.com/adaptlearning/jquery.resize/issues/7