CODEWITHSUNDEEP
javascripthtml
user1365010
user1365010

Reputation: 3363

Custom attributes

I would like to get the value of custom attributes. For exemple, for this:

<div style="-my-data:3;" id="foo" ></div>

I would like to write something like that:

document.getElementById("foo").style.myData;

But it's not working. How can I do?

Upvotes: 0

Views: 1035

Answers (3)

Joseph Silber
Joseph Silber

Reputation: 220136

You should be using HTML5's custom data-* attributes instead:

<div data-myDataName="3" id="foo"></div>

Then, to get it via JavaScript, just use this:

document.getElementById('foo').getAttribute('data-myDataName'); // '3'

Here's the fiddle: http://jsfiddle.net/c55nf/

P.S. Even though it's part of HTML5, it'll still work in older browsers. It was just standardized in HTML5.

Upvotes: 3

Luca
Luca

Reputation: 9745

use the html data attribute:

<div data-style="3" id="foo"></div>

and then use 

document.getElementById("foo").getAttribute("data-style");

to retrieve the information

Upvotes: 2

Jason McCreary
Jason McCreary

Reputation: 73031

Use HTML custom data attributes:

HTML:

<div data-myval="3" id="foo" ></div>​

JavaScript

alert(document.getElementById("foo").getAttribute('data-myval'));​

See the fiddle.

Upvotes: 0

Related Questions