Home/ Questions/Q 7022877
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-27T23:38:20+00:00

I have some data that I need to associate with specific element such as

  • 0

I have some data that I need to associate with specific element such as an individual table row. This data contains information such as the current state, and a unique identifier that correlates to an SQL row. When the user interacts with the element I want to read out the unique identifier, and with that identifier, issue an AJAX request to let the user change the state of that element.

After researching, it seems that there are two camps as to how to embed this element specific information.

1) Using a data- attribute in the html5. My understanding is this will work in modern web browsers as well as older browsers that don’t support html5. But while this works, it does not following the HMTL spec ( less than HTML5) and so it won’t validate if you run it through a HTML syntax checker.

2) Store the additional data into a javascript array, object etc. The extra work with this is now you need a way to correlate the javascript data to the html element.

What are the pros and cons of using these two different approaches to storing the data? And what approach would you recommend?

Thanks!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I wouldn’t worry about the data- attributes not passing validators. The attribute is in HTML5 because people were using similar, non-standardized, attributes for a long time specifically to solve this problem. Go ahead and start writing “HTML5” by using the parts of the spec that work, i.e. don’t break in a certain browser, and using the HTML5 doctype. The W3C validator at least already supports the doctype.

    As for which method to use, I think it really boils down to when you want to parse the information in the JavaScript interpreter: on page load or when the data is needed. I imagine it depends on just how much information you have as to which will be most efficient. But you can’t go wrong with adding it to the HTML with a data- attribute or two.

    Personally, I like adding the information to the HTML with data- attributes. In the scenario you describe, I would use data-state and data-rid (or similar) so that I don’t have to further parse the information (it sounds like you are thinking of putting two bits of information in one data- attribute). This way, your table of information is truly complete: the data is presented to the user and the markup contains further information that could be necessary to a parser.

    • 0