CODEWITHSUNDEEP
javascripthtml
ajyang818
ajyang818

Reputation: 505

Javascript/HTML: Using id vs. class when naming

I am starting to learn some Javascript using Meteor and am looking at their examples.

One bug that tripped me up for a bit happened when I was adding a text-field for input with a button next to it; users would type in a name they wanted to add to a list and then click the button to actually add it.

My question is: why does it seem to be the case that in the html, the text field has to be named with id="..." while the button has to be named with class="..."?

For additional reference, in my javascript file, I am using textfieldname.value and 'click input.buttonname'. Does the id vs. class requirement stem from how I'm using them?

Upvotes: 0

Views: 128

Answers (1)

Pointy
Pointy

Reputation: 414006

The "id" attribute is used to supply a globally-unique identifier for an element. The "class" attribute is used to categorize or typify an element according to its meaning, its intended use, its relationship to other elements, or whatever else your application requires.

Usually it's more flexible to use classes to identify things, because more than one element can be given the same class, and an element can have as many classes as are needed. Any single element may only have one "id", and the values must not be re-used in the same document. There are clear use cases for both attributes in which one or the other is obviously more appropriate, and many other cases where it's less clear and for which either could be used.

This isn't really a JavaScript issue so much as a "web application design" issue. How one labels HTML elements is dictated by the nature of the content (HTML), the needs of the presentation (CSS), and the intended behaviors (JavaScript).

Upvotes: 3

Related Questions