Javascript 计算元素'；没有'；t默认值

我想在px中计算一个元素（比如

div

）的高度，当它没有默认值（

initial

或

auto

）时使用javascript

请注意，我的元素现在有另一个高度值（例如40px），但我想了解如果我将其设置为

initial

或

auto

，它的高度（以像素为单位）是多少

换言之：

myElement.style.height = '40px'; // for example
// ...
console.log(myElement.clientHeight); // This logs "40". This is not the value I want.
myElement.style.height = 'initial';
console.log(myElement.clientHeight); // This logs the value I want. But I don't want to execute above statement AT ALL!

---

如果我理解正确，您希望能够获得元素在没有定义精确的高度样式值时的高度吗

答案很简单：你不能。浏览器必须呈现DOM才能访问链接到它的值，如clientHeight。

---

但是，您可以使用一些老套的方法，例如将高度设置为

auto

，读取它，然后将其设置回40px，或者使用隐藏元素（可见性：隐藏，而不是显示：无，因为需要渲染它），但是请注意，这有点脏，而且很难维护。

您可以通过调用

yourElement.getBoundingClientRect（）

来检索任何元素的维度，即使您没有为其维度之一提供显式值

此方法返回具有许多属性（包括高度）的对象

---

了解更多信息

如果您的元素是一个容器，这是迄今为止我找到的最佳解决方案。您可以将一个内部

div

直接插入元素中，以便它（内部

div

）包装（外部）元素的全部内容。因此：

<theElement style="height:40px;"> <!-- This is a CONTAINER! -->
    <div id="inner_div" style="margin:0; border:0; height:auto;">
        <!-- Your contents will be inserted here. -->
    <div>
</theElement>

---

请注意，内部

div

必须没有

边距

和

边框宽度

，其

CSS高度

必须是

auto

或

initial

---

另外，建议为

元素

插入CSS属性声明：

overflow-y:hidden

。因此，内部

div

无法从其父级边界进行视觉传递。

可以使用jQuery吗？欢迎使用堆栈溢出！请查看我们的示例，以帮助您提出一个好问题，从而得到一个好答案；cln.style.visibility='hidden'；getElementsByTagName（“正文”）[0].appendChild（cln）；cln.style.height='首字母'；控制台日志（cln.clientHeight）；可能的重复基本上是克隆元素，隐藏它，附加到主体，将高度更改为初始值，然后获得高度，我可以做得更好，但我在活动文件上，抱歉。这返回相同的

clientHeight

值！我试过了。theElement.clientHeight==Math.round（theElement.getBoundingClientRect（）.height）重写属性值时，如果不缓存原始值，则无法检索它。如果你仔细想想，当一个对象发生变异时，它必须丢弃旧的值，这样它才能将新的值放入。我建议您在设置元素的新高度之前存储元素的初始高度，这样，您就不必调用

myElement.style.height='initial'是的，这就是为什么我说“我想计算…”。商店？不，这是不可能的！它的价值可能会改变。它是一个动态元素。否，当其高度为
initial
时存储原始高度，这是固定的。存储其高度后，元素的内容可能会更改。所以“存储值”将不再有效。是的，您理解正确。谢谢你的指导。如果它没有常规的方式，我正在寻找一种干净的黑客方式。
console.log(theElement.clientHeight) // This logs 40.

yourDesiredValue = document.getElementById('inner_div').clientHeight;
console.log(yourDesiredValue);       // This logs that you want.

console.log(theElement.clientHeight) // This logs 40.