Question

I have a DOM element that shows time:

<div id="time"></div>

Time showing function is written in JavaScript.
But I also need to hold additional information about this element, for example time pattern.
I mean if I call a function like getElementById (just an example), I want to know this element additional attributes (in my case time pattern)
Is it possible to do that?

Answer 1

You can use data attributes. They’re meant to store data:

<div id="time" data-pattern="test"></div>

And some test JavaScript:

​var time = document.getElementById('time');

console.log(time.getAttribute('data-pattern')​​​​);​

If you’re using jQuery, you can use the .data() method to extract the value and automatically convert common data types:

$('#time').data('pattern');

Demo: http://jsfiddle.net/UPufH/