jQuery: attr('height') undefined

Question

Hi folks,

I have a container div with the following CSS:

#container {
  position:relative;
  overflow:hidden;
  width:200px;
  height:200px;
}

Why does this:

alert('height is ' + $("#container").attr('height'));

Return that height is undefined?

Thanks,

JG

Answer 1

Try:

$("#container").height()

It is due to the height being in the css and not an actual attribute on the html tag.

Answer 2

You probably want to use the css or height methods.

$('#container').css('height')

or

$('#container').height();

depending on what you are trying to do with it. See the referenced documentation for the differences.

Answer 3

jQuery.attr refers to HTML attributes not CSS properties. Use .css("height") or mentioned .height() method.

More about those methods:

1. jQuery.css()
2. jQuery.attr()
3. jQuery API Reference