Open In App

How to Check an Element with Specific ID Exists using JavaScript ?

Improve
Improve
Like Article
Like
Save
Share
Report

Given an HTML document containing some elements and the elements contain some id attribute. The task is to check whether the element with a specific ID exists or not using JavaScript.

There are two approaches that are discussed below: 

Approach 1: Using the document.getElementById() method

First, we will use document.getElementById() to get the ID and store the ID into a variable. Then compare the element (a variable that stores ID) with ‘null’ and identify whether the element exists or not.

Example: This example shows the implementation of the above-explained approach.

html




<!DOCTYPE html>
<html lang="en">
 
<head>
    <title>
        How to Check an Element with Specific
        ID Exists using JavaScript ?
    </title>
</head>
 
<body>
    <h1 style="color:green;">
        GeeksforGeeks
    </h1>
     
    <p>
        Click on button to check if
        element exists using JavaScript
    </p>
     
    <button onClick="GFG_Fun()">
        click here
    </button>
     
    <p id="result"></p>
     
    <script>
        let res = document.getElementById('result');
 
        function GFG_Fun() {
            let el = document.getElementById('GFG');
 
            if (el != null) {
                el_down.innerHTML = "Element Exists";
            } else {
                el_down.innerHTML = "Element Not Exists";
            }
        }
    </script>
</body>
 
</html>


Output: 

Approach 2: Using document.getElementById() and JSON.stringify() method

First, we will use document.getElementById() method to get the ID and store the ID into a variable. Then use JSON.stringify() method on the element (variable that store ID) and compare the element with ‘null’ string and then identify whether the element exists or not.

Example: This example shows the implementation of the above-explained approach.

html




<!DOCTYPE html>
<html lang="en">
 
<head>
    <title>
        How to Check an Element with Specific
        ID Exists using JavaScript ?
    </title>
</head>
 
<body>
    <h1 style="color:green;">
        GeeksforGeeks
    </h1>
 
    <p>
        Click on button to check if
        element exists using JavaScript
    </p>
 
    <button onClick="GFG_Fun()">
        click here
    </button>
 
    <p id="result"></p>
 
    <script>
        let res = document.getElementById('result');
 
        function GFG_Fun() {
            let elm = document.getElementById('GFGUP');
             
            if (JSON.stringify(elm) != "null") {
                el_down.innerHTML = "Element Exists";
            } else {
                el_down.innerHTML = "Element Not Exists";
            }
        }
    </script>
</body>
 
</html>


Output: 



Last Updated : 20 Dec, 2023
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads