使用jQuery获取在CSS中指定的实际值 [英] Get actual value specified in CSS using jQuery

问题描述

解释

我不能相信这个问题以前没有问过，但无论如何...请不要与此混淆问题。

我试图使用jQuery data 方法存储元素的高度，以便我可以检索此值并重置原始值一个特定的元素。

然而，当我尝试获取元素的高度时，它会返回计算的高度，而不是实际的CSS值。虽然这在其他情况下非常有用，但我实际上需要获取样式表中指定的确切值，无论它是100％，auto，10px等等。

我的问题

有没有一种方法可以使用jQuery获取元素的确切CSS（非计算）值？

<例如（CSS）：

  #wrapper {
 height：auto; 
} 
  

和JS：

  //返回'auto'NOT计算值... 
 var height = $（'＃wrapper'）。height（）; 
  

更多信息

目前可以看到只是删除了元素上的内联样式标签，这将删除jQuery应用的所有样式。这种方法的明显缺陷是，它将删除所有样式，而不仅仅是一个样式... ...

解决方案

有没有一种方法可以使用jQuery获取元素的精确CSS（非计算）值？

通过DOM检索 px 中的计算值。

就是说，您可以通过获取百分比元素高度并将其与父代的高度进行比较。 em ， en 和其他度量是不可能的。

Explanation

I cannot believe this has not been asked before but anyway... Please do not get confused with this question.

I am trying to store the height of an element using the jQuery data method so that I can retrieve this value and reset the original value on a specific element.

However, when I try to get the height of my element, it returns the computed height and not the actual CSS value. Whilst this is extremely helpful in other cases, I actually need to get the exact value specified in my stylesheet whether it be 100%, auto, 10px etc...

My Question

Is there a way to get the exact CSS (non-computed) value of an element using jQuery?

For example (CSS):

#wrapper {
    height: auto;
}

And JS:

// Returns 'auto' NOT computed value...
var height = $('#wrapper').height();

Further Information

The only alternative I can currently see is just removing the inline style tag on my element which will remove any styles applied by jQuery. The obviously flaw in this method is that it will remove all styles not just one in particular...

解决方案

Is there a way to get the exact CSS (non-computed) value of an element using jQuery?

You can only retrieve the computed value in px via the DOM.

That being said, you can work out the percentage by getting the elements height and comparing it to the parent's height. em, en and other measurements are not possible.

这篇关于使用jQuery获取在CSS中指定的实际值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！