JavaScript Tutorial

HTML Classes

The HTML "class" attribute is used to specify one or multiple class names for an HTML element. The class name can be used by CSS and JavaScript to apply styling or functionality to HTML elements. You can use this class in CSS by specifying a period (.) character followed by the name of the class to select elements.

A class attribute can be defined within the <style> tag or in a separate file using the period (.) character.

In an HTML document, we can use the same class attribute name with different elements.

Note: The class name is case-sensitive! Class names should be meaningful and related to the block of code

Syntax for Class 

To create a class, write a period (.) character followed by a class name. Then, define the CSS properties within curly braces ({}) in a CSS file:

Multiple Classes

We can use multiple class names with HTML elements. These class names must be separated by a space. When an HTML element has multiple class names, it can inherit the styles of all the classes. The styles will be applied in the order that they are listed.

Different Elements Can Share The Same Name

We can use the same class name with different tags like <h2> and <p> etc. to apply the same style to multiple elements.

Class Attribute in Javascript

The class attribute in HTML can not only be used by CSS, but also by JavaScript to perform certain tasks for specific elements. In JavaScript, you can access elements with a specific class name using the getElementsByClassName() method. This method returns an array-like object of all elements in the document that has the specified class name. You can then manipulate these elements using JavaScript.

In the above example, the script tag is used which is a part of javascript. In this, we have written code that helps in removing the element with the “language” class. 

Later on, we will discuss it’s the syntax in detail.

Supporting Browsers

Element

“Google Chrome

Microsoft

Firefox

Opera

Safari

Marquee

Yes

Yes

Yes

Yes

Yes

Go back to Previous Course