2

In my page, due to some reason (which I do not find relevant to the topic hence not explaining) a div gets duplicated and two divs with same id are generated in my html. While writing jquery code to remove all divs except topmost, I found that $("#id") was returning me just 1 element(note: there are two divs with same id now) whereas $("[id=]") was returning me 2. So finally my code worked with $("[id=]") but not with $("#id"). Any reason why? Is it that $("#id") returns only the first element it finds with specified id?

Please note that I have already come across a thread which has a similar question but does not answer my query

Community
  • 1
  • 1
Shubha
  • 45
  • 1
  • 4
  • 3
    Read Official docs https://api.jquery.com/id-selector/ and https://api.jquery.com/attribute-equals-selector/ – Satpal Sep 19 '16 at 06:39
  • 3
    yes, `$("#id")` will always gives you single result. Just like `document.getelementBuId`. Check `$("body #id")` and i am sure you will get result count 2 similar to `$("[id=]")` – vijayP Sep 19 '16 at 06:40
  • Hi Rajaprabhu, see you after long time in SO – Sudharsan S Sep 19 '16 at 06:41
  • If you have control over what is generating the HTML you need to fix the generation of duplicate ids. While your web page or app may appear to work, its behavior is not garunteed to be consitant. See: https://developer.mozilla.org/en/docs/Web/HTML/Global_attributes/id – Jon P Sep 19 '16 at 06:42
  • @shubha Please refer : https://api.jquery.com/attribute-starts-with-selector/ – Elangovan Sep 19 '16 at 06:42
  • this question already exists in SO. I will close it as duplicate. – Sudharsan S Sep 19 '16 at 06:43
  • 1
    Possible duplicate of [Jquery what is the difference between $(#id) and $(\[id=\])](http://stackoverflow.com/questions/23733990/jquery-what-is-the-difference-between-id-and-id) – Sudharsan S Sep 19 '16 at 06:43
  • this link has the answer, refer it http://stackoverflow.com/questions/23733990/jquery-what-is-the-difference-between-id-and-id – caldera.sac Sep 19 '16 at 06:49
  • This is a good explanation: http://stackoverflow.com/questions/8498579/how-jquery-works-when-there-are-multiple-elements-with-the-same-id – techie_28 Sep 19 '16 at 07:05

1 Answers1

4

The thing is $("#id") will always gives you single result like document.getelementById() however when you do $("[id=]") you are finding all elements with a given attibute as id so it returns you multiple elements since it doesn't use the javascript document.getelementById() now.

$("[id=]") is something that you use when you want to select some elements form your document that follow some rules like

Attribute Contains Selector [name*=”value”]

Selects elements that have the specified attribute with a value containing a given substring.

Attribute Contains Word Selector [name~=”value”]

Selects elements that have the specified attribute with a value containing a given word, delimited by spaces.

Attribute Ends With Selector [name$=”value”]

Selects elements that have the specified attribute with a value ending exactly with a given string. The comparison is case sensitive.

etc.

For more information see https://api.jquery.com/category/selectors/ However in you HTML you should ideally keep the id to be unique. If you want multiple elements to have same id then use class instead.

Shubham Khatri
  • 270,417
  • 55
  • 406
  • 400