jQuery innerHeight() with Examples

jQuery Web Development Front End Technology

The innerHeight() method in jQuery is used to return the inner height. It includes padding, but border and margin are ignored.

Syntax

The syntax is as follows −

$(selector).innerHeight()

Example

Let us now see an example to implement the jQuery innerHeight() method−

Live Demo

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
   $(document).ready(function(){
      $("button").click(function(){
         document.getElementById("demo").innerHTML = "<br>Inner Height of DIV = " + $("div").innerHeight()
      });
   });
</script>
</head>
<body>
<h2>Demo Box</h2>
<div style="height:150px;width:450px;padding:10px;margin:2px;background-color:green;"></div><br>
<button>Inner Height of div</button>
<p id="demo"></p>
</body>
</html>