How to get the height of device screen in JavaScript ?

Given an HTML document which is running on a device. The task is to find the height of the working screen device using JavaScript. Prerequisite – How to get the width of device screen in JavaScript ? 

Example 1: This example uses window.innerHeight property to get the height of the device screen. The innerHeight property is used to return the height of the device. 

html




<h1 style="color:green;">
    w3wiki
</h1>
  
<p id="GFG_UP"></p>
  
<button onclick="GFG_Fun()">
    click here
</button>
  
<p id="GFG_DOWN"></p>
  
<!-- Script to display the device screen Height -->
<script>
    var el_up = document.getElementById("GFG_UP");
    var el_down = document.getElementById("GFG_DOWN");
      
    el_up.innerHTML =
    "Click on the button to get the" +
    " Height of the device's screen";
      
    function GFG_Fun() {
        var Height = window.innerHeight;
        el_down.innerHTML = Height + " pixels";
    }
</script>


Output:

How to get the height of device screen in JavaScript ?

Example 2: This example uses document.documentElement.clientHeight method to get the Height of the device screen. 

html




<h1 style="color:green;">
    w3wiki
</h1>
  
<p id="GFG_UP"></p>
  
<button onclick="GFG_Fun()">
    click here
</button>
  
<p id="GFG_DOWN"></p>
  
<!-- Script to display the device screen Height -->
<script>
    var el_up = document.getElementById("GFG_UP");
    var el_down = document.getElementById("GFG_DOWN");
      
    el_up.innerHTML =
    "Click on the button to get the" +
    " Height of the device's screen";
      
    function GFG_Fun() {
        el_down.innerHTML =
            document.documentElement.clientHeight + " pixels";
    }
</script>


Output:

How to get the height of device screen in JavaScript ?



Contact Us