How to Check the Specific Element in the JavaScript Class?

At times, we must verify that the element does have the class 'className' ( Any specific name ). It is included the method of the class List entity. It can be used to determine whether an element has a particular class name. The single method is used to check the required element in the JavaScript class.

Syntax

The following syntax shows the available

• It gives back a Boolean result. It returns true if the element has the class name; otherwise, it returns false.
• Here, we will make a straightforward HTML page and add an element with the class and id names main.
• Finding the h1 that has the class name main is our responsibility.

How to Operate JavaScript "contains" Method

The className is passed to the contains() method of the classList property of the element in this method. The method returns true if the element includes the className. Otherwise, false is returned.

• Consider the following div> element, which has the classes secondary and info.

• Use the JavaScript command to see if the second class is present in the div element:

• In this example, we choose the div using the querySelector() function and check to see if the second class is present in its class list using the contains() method.

Due to the absence of the error class on the div> element, the following example returns false.

We can use it as a reference for the availability in the html tag.

Examples

The following examples show specific elements of the page using JavaScript.

Example 1

The following example shows available classes in the element using the JavaScript method. Here we use the alert tag to display the output message.

Output

The given image shows the available class result as an output.

Example 2

The following example shows available classes in the element using the JavaScript method. Here, the class name is available in the element shown using the innerHTML function.

Output

The given image shows the available class result as an output.

Example 3

The following example shows available classes in the element using the JavaScript method. Here, the class name is not available in the element shown using the innerHTML function.

Output

The given image shows the available class result as an output.

Example 4

The following example shows available classes in the element using the JavaScript method. Here, the first class name is available in the element and the second class name is not available in the Html element. The result values are displayed using the innerHTML function.

Output

The given image shows the available class result as an output.

Conclusion

The contains() function in JavaScript is used to check required class is available or not in the Html element. It is an easy, simple, and user-friendly method to run JavaScript code for checking the class name.