Get list of data-* attributes using javascript / jQuery

by

Actually, if you’re working with jQuery, as of version 1.4.3 1.4.4 (because of the bug as mentioned in the comments below), data-* attributes are supported through .data():

As of jQuery 1.4.3 HTML 5 data-
attributes will be automatically
pulled in to jQuery’s data object.

Note that strings are left intact
while JavaScript values are converted
to their associated value (this
includes booleans, numbers, objects,
arrays, and null). The data-
attributes are pulled in the first
time the data property is accessed and
then are no longer accessed or mutated
(all data values are then stored
internally in jQuery).

The jQuery.fn.data function will return all of the data- attribute inside an object as key-value pairs, with the key being the part of the attribute name after data- and the value being the value of that attribute after being converted following the rules stated above.

I’ve also created a simple demo if that doesn’t convince you: http://jsfiddle.net/yijiang/WVfSg/

More Related Contents:

  1. How to display an chage photo option on mouse hover similar to linkedin using Javascript? [closed]
  2. How to send data to the server via Ajax?
  3. How to force browser to show image 3 inches wide?
  4. Making a quiz in HTML and Javascript [closed]
  5. HTML: how refresh information in [closed]
  6. HTML Form Submit pass array to PHP [closed]
  7. Add/Remove Class of Nav Objects on Page Scroll
  8. How to find certain text in HTML
  9. Where should I put tags in HTML markup?
  10. How can I select an element by name with jQuery?
  11. How to save an image to localStorage and display it on the next page?
  12. jQuery disable/enable submit button
  13. Get class name using jQuery
  14. Set keyboard focus to a
  15. Javascript regex returning true.. then false.. then true.. etc [duplicate]
  16. how to disable DIV element and everything inside [duplicate]
  17. How Do I Stop My Web Content From Shifting Left When The Vertical Scrollbar Appears? Roll-Up of Advice 2017 [duplicate]
  18. Load HTML page dynamically into div with jQuery
  19. jQuery position DIV fixed at top on scroll
  20. How to define the css :hover state in a jQuery selector?
  21. How to prevent html/JavaScript code modification
  22. How can I set preview of video file, selecting from input type=’file’
  23. Detect browser wrapped lines via javascript
  24. The data-toggle attributes in Twitter Bootstrap
  25. Extracting text from a contentEditable div
  26. DOM Element Width before Appended to DOM
  27. refresh div with jquery
  28. focus on next tabindex of HTML element onEnter keypress by JQuery
  29. Remove everything within script and style tags
  30. Find and replace nth occurrence of [bracketed] expression in string

Leave a Comment