Opinion: in HTML, Possible Duplicate IDs or Non-Standard Attributes?

Question

It seems pretty common to want to let your javascript know a particular dom node corresponds to a record in the database. So, how do you do it?

One way I\'ve seen t

Answer 1

Non-standard attributes are fine, if you're using XHTML and take the time to extend the DTD you're using to cover the new attributes. Personally, I'd just use a more unique id, like some of the other people have suggested.

Answer 2

If you set non-standard properties, be sure to either set them programmatically (as everything will be legal that way) or go through the trouble of revising the dtd !-)

But I would use an ID with a meaningful word prepending the DB-id and then use .getElementById, as every necessary informtion is at hand ...

Answer 3

You'll be giving up some control of the DOM

True, nothing will explode, but it's bad practice. If you put duplicate ids on the page you'll basically loose the ability to be sure about what you're getting when you try to access an element by its id.

var whoKnows = document.getElementById('duplicateId');

The behavior is actually different, depending on the browser. In any case, you can use classNames for duplicate values, and you'll be avoiding the problem altogether.

The browser will try to overlook faults in your markup, but things become messy and more difficult. The best thing to do is keep your markup valid. You can describe both the type of the element and its unique database id in a className. You could even use multiple classNames to differentiate between them. There are a lot of valid possibilities:

<div class="friend04"/>
<div class="featuredFriend04" />

or

<div class="friend friend04" />
<div class="featuredFriend friend04" />

or

<div class="friend objectId04" />
<div class="groupMember objectId04" />

or

<div class="friend objectId04" />
<div class="friend objectId04" id="featured" />

These are all completely legitimate & valid snippets of XHTML. Notice how, in the last snippet, that I've still got an id working for me, which is nice. Accessing elements by their id is very quick and easy, so you definitely want to be able to leverage it when you can.

You'll already spend enough of your time in javascript making sure that you've got the right values and types. Putting duplicate ids on the page will just make things harder for you. If you can find ways to write standards-compliant markup, it has many practical benefits.

Answer 4

I don't like John Millikin's solution. It's gonna be performance-intensive on large datasets.

An optimization on his code could be replacing the regular expression with a call to substring() since the first few characters of the id-property are constant.

I'd go with matching class and then a specific id though.