Jump to content
terryds

Difference between id and class

Recommended Posts

Hellooo.. :DCould you please tell me the difference between id and class?I think that it is the same..Take a look ! Using ID :

 <!DOCTYPE html><html><head><style>#center{text-align:center;}</style></head> <body><h1 id="center">Center-aligned heading</h1><p id="center">Center-aligned paragraph.</p> </body></html>

Using Class :

<!DOCTYPE html><html><head><style>.center{text-align:center;}</style></head> <body><h1 class="center">Center-aligned heading</h1><p class="center">Center-aligned paragraph.</p> </body></html>

I see there's no difference, but in w3schools.com,It says that The id SelectorThe id selector is used to specify a style for a single, unique element.The id selector uses the id attribute of the HTML element, and is defined with a "#". The class SelectorThe class selector is used to specify a style for a group of elements. Unlike the id selector, the class selector is most often used on several elements.This allows you to set a particular style for many HTML elements with the same class.The class selector uses the HTML class attribute, and is defined with a "." But, i think the id selector can also be for a group of elements.. Please explain this ! :D

Share this post


Link to post
Share on other sites

It can, but it should not. It's just the rules. It's improper to use ids for multiple elements. Id also can be called from the URL unlike classes. Ids are identifiers, classes are a class of style. Ids are also called for DOM, js, etc. So many reasons to explain. Just follow the rules.

Share this post


Link to post
Share on other sites

I'm agree with you, DarkxPunk. Sometimes, when if you put the same id in two divs only the first div it will work, and with paragraphs you should always use classes

Share this post


Link to post
Share on other sites

Yup, classes can be applied to multiple elements on a single page, whereas ID's can only be used once on any given page. ID's are also used to allow JS to identify a certain element. For example, if you want to grab an element with a certain ID and perform some sort of action on that element, you use JS to identify it like so:

<div id="element_id"></div>

var element = document.getElementById('element_id');

P.S - you don't have to save it to a variable, you can perform another action such as writing innerHTML to the page like:

document.getElementById('element_id').innerHTML = someValue;

Hope this helps, Kind regards, Lab.

Edited by Labtec
  • Like 1

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...