CODEWITHSUNDEEP
jquery
user2345998
user2345998

Reputation: 649

Jquery - get "defined" height of an element

In the code, the element (tr) has a an inline style tag which defines a height of 31px. But after rendering, the height of the tr expands to 32px, because of the content.

I'm trying to get read the height of 31px via Jquery, but with these methods I only get the computed height of 32px.

My question is: Do I have to read the style attribute and extract the height from there, or is there another way getting this value using Jquery (or native javascript).

Upvotes: 0

Views: 74

Answers (3)

sajalsuraj
sajalsuraj

Reputation: 992

You can store that height value in a variable and use it wherever you want

Example :- 

var height = $('tr').css('height'); //This will return the original value

Upvotes: 0

Jai
Jai

Reputation: 74738

.css(prop) is the method in jQuery which behaves as a getter of css styles:

$('pre').append('.css("height")===='+$('button').css('height') +'<<<<<<:::::>>>>>.height()====='+$('button').height());
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<pre></pre>
<button style='height:80px;'>Test</button>

Above you can see .css('height') returns the actual height set but .height() has different calculation.

Upvotes: 0

Ianis
Ianis

Reputation: 1175

You can use .height 

trHeight = document.getElementById("myTr").style.height;

Upvotes: 1

Related Questions