如何获取 HTML 元素的原始高度？答案

【问题标题】：How to get the original Height of a HTML element?如何获取 HTML 元素的原始高度？
【发布时间】：2012-05-11 21:29:58
【问题描述】：

我有一个 div：

<div id="div" style="height:150px; border:solid thin blue;"></div>

有没有办法检索原始 div 高度？ div 可以调整大小，因此用户可能在我的代码加载之前调整了它的大小。
注意：我的代码是一个 jQuery 插件，所以我不知道在调用我的插件之前元素发生了什么（所以请不要告诉我在元素数据中存储高度......）

jqFiddle 在这个演示中，我想在调整 div 大小后得到 150。
任何帮助将不胜感激！

【问题讨论】：

【解决方案1】：

不，因为resizable() 方法会覆盖内联样式height 值。

您需要将其存储在其他地方。

例如在使div调整大小之前：

var originalHeight = $('#div').height();
$('#div').resizable();

$('#cmd').button().click(function(){
    alert(originalHeight);
});

【讨论】：

我不能，不是我初始化元素，我的插件可能会在其他插件执行后被调用..
所以，正如我所说，你不能。没有元素变化的历史。
不幸的是，这个答案在技术上很有帮助！至少我必须找到另一种方法来解决我的问题。我有 3 个答案教我如何设置大小，如何在数据中存储大小！！！！哇！！！！还是谢谢
@skafandri：您可以重写您的插件，使其初始化与执行分开。喜欢$(...).plugin("init");然后做你不知道的“事情”，然后打电话给$(...).plugin("reset");
我正在尝试以另一种方式解决我的问题，请查看stackoverflow.com/questions/10552382/…

【解决方案2】：

我不知道有什么方法可以从 DOM 中获取旧数据，但是你能不能坚持让插件调用一个 init 函数然后获取值？您还可以在文档中建议在完成 init 函数之前不要移动元素，尽管如果通过 .ready() 调用它，这应该在用户有机会眨眼之前发生。

如何使用 jquery-ui 调整 div 的大小？

另一种选择可能是使用 ajax 再次获取页面，然后解析页面，但这会大量工作并且非常混乱。

【讨论】：

【解决方案3】：

originalHeight=0;
$(document).ready(function()
{
    originalHeight= $("#div").height()
});

【讨论】：

虽然代码不言自明，但代码背后的意图可以使用一点描述。你为什么要采用这种技术？它对手头的问题有什么特别帮助？我认为这个答案最有价值，如果您提供对此信息的编辑，我会很高兴地支持它。
我不明白在加载代码之前调整dvi大小的问题。加载文档后，此代码将获得原始高度（或者我可以在 div 加载事件上绑定此逻辑）。如果我没有很好地理解问题，我深表歉意
哦，我想你已经理解了这个问题。您在此处提供的代码与接受的答案相匹配。我认为您已经省略了可以使这个更好的答案的是对为什么这应该起作用的描述。
是的，但它背后的意图不是。