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;">
    GeeksforGeeks
</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;">
    GeeksforGeeks
</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 ?