Does ID have to be unique in the whole page?
I am using jQuery and I am just wondering, does ID have to be always unique in the whole page? Class, I know, can be repeated as many times as you like, what about ID?
jquery html css
add a comment |
I am using jQuery and I am just wondering, does ID have to be always unique in the whole page? Class, I know, can be repeated as many times as you like, what about ID?
jquery html css
2
an id attribute is generally used only once because an ID is unique
– Ryan
Feb 26 '12 at 16:10
2
You can't override the definition of an ID if you feel you could do so.
– Narayana Nagireddi
Feb 26 '12 at 16:21
5
why is everyone down voting this question? I can se it is simple but that is not a reason to down vote, you should just move on...
– nodrog
Feb 26 '12 at 16:46
1
@nodrog people dont know the meaning of downvote here.... I Upvotd.
– Royi Namir
Feb 27 '12 at 8:27
add a comment |
I am using jQuery and I am just wondering, does ID have to be always unique in the whole page? Class, I know, can be repeated as many times as you like, what about ID?
jquery html css
I am using jQuery and I am just wondering, does ID have to be always unique in the whole page? Class, I know, can be repeated as many times as you like, what about ID?
jquery html css
jquery html css
asked Feb 26 '12 at 16:09
good_eveninggood_evening
8,86855161271
8,86855161271
2
an id attribute is generally used only once because an ID is unique
– Ryan
Feb 26 '12 at 16:10
2
You can't override the definition of an ID if you feel you could do so.
– Narayana Nagireddi
Feb 26 '12 at 16:21
5
why is everyone down voting this question? I can se it is simple but that is not a reason to down vote, you should just move on...
– nodrog
Feb 26 '12 at 16:46
1
@nodrog people dont know the meaning of downvote here.... I Upvotd.
– Royi Namir
Feb 27 '12 at 8:27
add a comment |
2
an id attribute is generally used only once because an ID is unique
– Ryan
Feb 26 '12 at 16:10
2
You can't override the definition of an ID if you feel you could do so.
– Narayana Nagireddi
Feb 26 '12 at 16:21
5
why is everyone down voting this question? I can se it is simple but that is not a reason to down vote, you should just move on...
– nodrog
Feb 26 '12 at 16:46
1
@nodrog people dont know the meaning of downvote here.... I Upvotd.
– Royi Namir
Feb 27 '12 at 8:27
2
2
an id attribute is generally used only once because an ID is unique
– Ryan
Feb 26 '12 at 16:10
an id attribute is generally used only once because an ID is unique
– Ryan
Feb 26 '12 at 16:10
2
2
You can't override the definition of an ID if you feel you could do so.
– Narayana Nagireddi
Feb 26 '12 at 16:21
You can't override the definition of an ID if you feel you could do so.
– Narayana Nagireddi
Feb 26 '12 at 16:21
5
5
why is everyone down voting this question? I can se it is simple but that is not a reason to down vote, you should just move on...
– nodrog
Feb 26 '12 at 16:46
why is everyone down voting this question? I can se it is simple but that is not a reason to down vote, you should just move on...
– nodrog
Feb 26 '12 at 16:46
1
1
@nodrog people dont know the meaning of downvote here.... I Upvotd.
– Royi Namir
Feb 27 '12 at 8:27
@nodrog people dont know the meaning of downvote here.... I Upvotd.
– Royi Namir
Feb 27 '12 at 8:27
add a comment |
10 Answers
10
active
oldest
votes
Yes, it must be unique.
HTML4:
http://www.w3.org/TR/html4/struct/global.html
Section 7.5.2:
id = name [CS]
This attribute assigns a name to an element. This name must be unique in a document.
HTML5:
http://www.w3.org/TR/html5/dom.html#the-id-attribute
The id attribute specifies its element's unique identifier (ID). The
value must be unique amongst all the IDs in the element's home subtree
and must contain at least one character. The value must not contain
any space characters.
add a comment |
from mdn
https://developer.mozilla.org/en/DOM/element.id
so i guess it better be...
add a comment |
Browsers used to be lenient on this (many years ago when css was young) and allow the ID to be used more than once. They have become more strict.
However, yes ID's are to be unique and only used once.
If you need to use css formatting more than once use CLASS.
add a comment |
Yes, IDs are unique. Class are not.
add a comment |
IDs always have to be unique.
Everybody has a unique identification number (ex. Social Security number), and there are lots of people in a social class
add a comment |
That's basically the whole point of an ID. :) IDs are specific, can only be used once per page. Classes can be used as pleased.
add a comment |
With Javascript, you can only reference to one element using ID. document.getElementById and jQuery's $ selector will return only the first element matching. So it doesn't make sense using the same ID on multiple elements.
add a comment |
Jan 2018, here is Youtube HTML , you can see id="button" id="info" are duplicated.

add a comment |
Technically, by HTML5 standards ID must be unique on the page - https://developer.mozilla.org/en/DOM/element.id
But I've worked on extremely modular websites, where this is completely ignored and it works. And it makes sense - the most surprising part.
We call it "componentization"
For example, you might have a component on your page, which is some kind of widget. It has stuff inside with their own unique IDs eg "ok-button"
Once there are many of these widgets on the page, you technically have invalid HTML. But it makes perfect sense to componentize your widgets so that they each, internally, reference their own ok button eg if using jquery to search from it's own root it might be: $widgetRoot.find("#ok-button")
This works for us, thought technically IDs shouldn't be used at all, once they're not unique.
As sited above, even YouTube do it, so it's not so renegade
add a comment |
There are great answers for the same question at https://softwareengineering.stackexchange.com/questions/127178/two-html-elements-with-same-id-attribute-how-bad-is-it-really.
One tidbit not mentioned above is that if there are several identical ids one the same page (which happens, even though it violates the standard):
If you have to work around this (that's sad), you can use
$("*#foo")which will convince jQuery to usegetElementsByTagNameand return a list of all matched elements.
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f9454645%2fdoes-id-have-to-be-unique-in-the-whole-page%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
10 Answers
10
active
oldest
votes
10 Answers
10
active
oldest
votes
active
oldest
votes
active
oldest
votes
Yes, it must be unique.
HTML4:
http://www.w3.org/TR/html4/struct/global.html
Section 7.5.2:
id = name [CS]
This attribute assigns a name to an element. This name must be unique in a document.
HTML5:
http://www.w3.org/TR/html5/dom.html#the-id-attribute
The id attribute specifies its element's unique identifier (ID). The
value must be unique amongst all the IDs in the element's home subtree
and must contain at least one character. The value must not contain
any space characters.
add a comment |
Yes, it must be unique.
HTML4:
http://www.w3.org/TR/html4/struct/global.html
Section 7.5.2:
id = name [CS]
This attribute assigns a name to an element. This name must be unique in a document.
HTML5:
http://www.w3.org/TR/html5/dom.html#the-id-attribute
The id attribute specifies its element's unique identifier (ID). The
value must be unique amongst all the IDs in the element's home subtree
and must contain at least one character. The value must not contain
any space characters.
add a comment |
Yes, it must be unique.
HTML4:
http://www.w3.org/TR/html4/struct/global.html
Section 7.5.2:
id = name [CS]
This attribute assigns a name to an element. This name must be unique in a document.
HTML5:
http://www.w3.org/TR/html5/dom.html#the-id-attribute
The id attribute specifies its element's unique identifier (ID). The
value must be unique amongst all the IDs in the element's home subtree
and must contain at least one character. The value must not contain
any space characters.
Yes, it must be unique.
HTML4:
http://www.w3.org/TR/html4/struct/global.html
Section 7.5.2:
id = name [CS]
This attribute assigns a name to an element. This name must be unique in a document.
HTML5:
http://www.w3.org/TR/html5/dom.html#the-id-attribute
The id attribute specifies its element's unique identifier (ID). The
value must be unique amongst all the IDs in the element's home subtree
and must contain at least one character. The value must not contain
any space characters.
edited Jul 28 '17 at 12:07
czerny
5,22054156
5,22054156
answered Feb 26 '12 at 16:16
FatalErrorFatalError
39.7k1077100
39.7k1077100
add a comment |
add a comment |
from mdn
https://developer.mozilla.org/en/DOM/element.id
so i guess it better be...
add a comment |
from mdn
https://developer.mozilla.org/en/DOM/element.id
so i guess it better be...
add a comment |
from mdn
https://developer.mozilla.org/en/DOM/element.id
so i guess it better be...
from mdn
https://developer.mozilla.org/en/DOM/element.id
so i guess it better be...
answered Feb 26 '12 at 16:11
Royi NamirRoyi Namir
76.5k99337599
76.5k99337599
add a comment |
add a comment |
Browsers used to be lenient on this (many years ago when css was young) and allow the ID to be used more than once. They have become more strict.
However, yes ID's are to be unique and only used once.
If you need to use css formatting more than once use CLASS.
add a comment |
Browsers used to be lenient on this (many years ago when css was young) and allow the ID to be used more than once. They have become more strict.
However, yes ID's are to be unique and only used once.
If you need to use css formatting more than once use CLASS.
add a comment |
Browsers used to be lenient on this (many years ago when css was young) and allow the ID to be used more than once. They have become more strict.
However, yes ID's are to be unique and only used once.
If you need to use css formatting more than once use CLASS.
Browsers used to be lenient on this (many years ago when css was young) and allow the ID to be used more than once. They have become more strict.
However, yes ID's are to be unique and only used once.
If you need to use css formatting more than once use CLASS.
answered Feb 26 '12 at 16:17
cjtechcjtech
30118
30118
add a comment |
add a comment |
Yes, IDs are unique. Class are not.
add a comment |
Yes, IDs are unique. Class are not.
add a comment |
Yes, IDs are unique. Class are not.
Yes, IDs are unique. Class are not.
answered Feb 26 '12 at 16:11
Michele SpagnuoloMichele Spagnuolo
874514
874514
add a comment |
add a comment |
IDs always have to be unique.
Everybody has a unique identification number (ex. Social Security number), and there are lots of people in a social class
add a comment |
IDs always have to be unique.
Everybody has a unique identification number (ex. Social Security number), and there are lots of people in a social class
add a comment |
IDs always have to be unique.
Everybody has a unique identification number (ex. Social Security number), and there are lots of people in a social class
IDs always have to be unique.
Everybody has a unique identification number (ex. Social Security number), and there are lots of people in a social class
answered Feb 26 '12 at 16:15
user1116560
add a comment |
add a comment |
That's basically the whole point of an ID. :) IDs are specific, can only be used once per page. Classes can be used as pleased.
add a comment |
That's basically the whole point of an ID. :) IDs are specific, can only be used once per page. Classes can be used as pleased.
add a comment |
That's basically the whole point of an ID. :) IDs are specific, can only be used once per page. Classes can be used as pleased.
That's basically the whole point of an ID. :) IDs are specific, can only be used once per page. Classes can be used as pleased.
answered Feb 26 '12 at 16:15
Bram VanroyBram Vanroy
13.3k1365138
13.3k1365138
add a comment |
add a comment |
With Javascript, you can only reference to one element using ID. document.getElementById and jQuery's $ selector will return only the first element matching. So it doesn't make sense using the same ID on multiple elements.
add a comment |
With Javascript, you can only reference to one element using ID. document.getElementById and jQuery's $ selector will return only the first element matching. So it doesn't make sense using the same ID on multiple elements.
add a comment |
With Javascript, you can only reference to one element using ID. document.getElementById and jQuery's $ selector will return only the first element matching. So it doesn't make sense using the same ID on multiple elements.
With Javascript, you can only reference to one element using ID. document.getElementById and jQuery's $ selector will return only the first element matching. So it doesn't make sense using the same ID on multiple elements.
answered Feb 26 '12 at 16:26
keunekeune
5,03042346
5,03042346
add a comment |
add a comment |
Jan 2018, here is Youtube HTML , you can see id="button" id="info" are duplicated.

add a comment |
Jan 2018, here is Youtube HTML , you can see id="button" id="info" are duplicated.

add a comment |
Jan 2018, here is Youtube HTML , you can see id="button" id="info" are duplicated.

Jan 2018, here is Youtube HTML , you can see id="button" id="info" are duplicated.

answered Jan 13 '18 at 11:42
vanduc1102vanduc1102
2,04212523
2,04212523
add a comment |
add a comment |
Technically, by HTML5 standards ID must be unique on the page - https://developer.mozilla.org/en/DOM/element.id
But I've worked on extremely modular websites, where this is completely ignored and it works. And it makes sense - the most surprising part.
We call it "componentization"
For example, you might have a component on your page, which is some kind of widget. It has stuff inside with their own unique IDs eg "ok-button"
Once there are many of these widgets on the page, you technically have invalid HTML. But it makes perfect sense to componentize your widgets so that they each, internally, reference their own ok button eg if using jquery to search from it's own root it might be: $widgetRoot.find("#ok-button")
This works for us, thought technically IDs shouldn't be used at all, once they're not unique.
As sited above, even YouTube do it, so it's not so renegade
add a comment |
Technically, by HTML5 standards ID must be unique on the page - https://developer.mozilla.org/en/DOM/element.id
But I've worked on extremely modular websites, where this is completely ignored and it works. And it makes sense - the most surprising part.
We call it "componentization"
For example, you might have a component on your page, which is some kind of widget. It has stuff inside with their own unique IDs eg "ok-button"
Once there are many of these widgets on the page, you technically have invalid HTML. But it makes perfect sense to componentize your widgets so that they each, internally, reference their own ok button eg if using jquery to search from it's own root it might be: $widgetRoot.find("#ok-button")
This works for us, thought technically IDs shouldn't be used at all, once they're not unique.
As sited above, even YouTube do it, so it's not so renegade
add a comment |
Technically, by HTML5 standards ID must be unique on the page - https://developer.mozilla.org/en/DOM/element.id
But I've worked on extremely modular websites, where this is completely ignored and it works. And it makes sense - the most surprising part.
We call it "componentization"
For example, you might have a component on your page, which is some kind of widget. It has stuff inside with their own unique IDs eg "ok-button"
Once there are many of these widgets on the page, you technically have invalid HTML. But it makes perfect sense to componentize your widgets so that they each, internally, reference their own ok button eg if using jquery to search from it's own root it might be: $widgetRoot.find("#ok-button")
This works for us, thought technically IDs shouldn't be used at all, once they're not unique.
As sited above, even YouTube do it, so it's not so renegade
Technically, by HTML5 standards ID must be unique on the page - https://developer.mozilla.org/en/DOM/element.id
But I've worked on extremely modular websites, where this is completely ignored and it works. And it makes sense - the most surprising part.
We call it "componentization"
For example, you might have a component on your page, which is some kind of widget. It has stuff inside with their own unique IDs eg "ok-button"
Once there are many of these widgets on the page, you technically have invalid HTML. But it makes perfect sense to componentize your widgets so that they each, internally, reference their own ok button eg if using jquery to search from it's own root it might be: $widgetRoot.find("#ok-button")
This works for us, thought technically IDs shouldn't be used at all, once they're not unique.
As sited above, even YouTube do it, so it's not so renegade
answered Feb 26 '18 at 2:24
PandaWoodPandaWood
4,97873849
4,97873849
add a comment |
add a comment |
There are great answers for the same question at https://softwareengineering.stackexchange.com/questions/127178/two-html-elements-with-same-id-attribute-how-bad-is-it-really.
One tidbit not mentioned above is that if there are several identical ids one the same page (which happens, even though it violates the standard):
If you have to work around this (that's sad), you can use
$("*#foo")which will convince jQuery to usegetElementsByTagNameand return a list of all matched elements.
add a comment |
There are great answers for the same question at https://softwareengineering.stackexchange.com/questions/127178/two-html-elements-with-same-id-attribute-how-bad-is-it-really.
One tidbit not mentioned above is that if there are several identical ids one the same page (which happens, even though it violates the standard):
If you have to work around this (that's sad), you can use
$("*#foo")which will convince jQuery to usegetElementsByTagNameand return a list of all matched elements.
add a comment |
There are great answers for the same question at https://softwareengineering.stackexchange.com/questions/127178/two-html-elements-with-same-id-attribute-how-bad-is-it-really.
One tidbit not mentioned above is that if there are several identical ids one the same page (which happens, even though it violates the standard):
If you have to work around this (that's sad), you can use
$("*#foo")which will convince jQuery to usegetElementsByTagNameand return a list of all matched elements.
There are great answers for the same question at https://softwareengineering.stackexchange.com/questions/127178/two-html-elements-with-same-id-attribute-how-bad-is-it-really.
One tidbit not mentioned above is that if there are several identical ids one the same page (which happens, even though it violates the standard):
If you have to work around this (that's sad), you can use
$("*#foo")which will convince jQuery to usegetElementsByTagNameand return a list of all matched elements.
edited Apr 12 '17 at 7:31
Community♦
11
11
answered Apr 21 '16 at 16:11
serv-incserv-inc
15.4k57290
15.4k57290
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f9454645%2fdoes-id-have-to-be-unique-in-the-whole-page%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
2
an id attribute is generally used only once because an ID is unique
– Ryan
Feb 26 '12 at 16:10
2
You can't override the definition of an ID if you feel you could do so.
– Narayana Nagireddi
Feb 26 '12 at 16:21
5
why is everyone down voting this question? I can se it is simple but that is not a reason to down vote, you should just move on...
– nodrog
Feb 26 '12 at 16:46
1
@nodrog people dont know the meaning of downvote here.... I Upvotd.
– Royi Namir
Feb 27 '12 at 8:27