I’m looking for an elegant way to add data to an element on server side so that jQuery/JavaScript can use it. I also do not want to make too many calls to server so data must be there upfront.
Scenario example.
Server side (PHP), I create a list of user images. To this, I want to add name, surname, age, etc.
When clicking on the images, jQuery must then do something with this data.
Possibilities I’ve considered:
Have the data as href, then on click, get the href and return false.
Have the data as classes.
Are there any better ways?
The HTML specification reserves attributes beginning with
data-for this purpose. For example:You can name them as you like as long as you follow the
data-*format.If you want structured semantic data, consider using RDFa Lite with an appropriate schema.