Getting the values of HTML Data attributes with Jquery

Question

I have a click function that passes the following dom as this:

<span class="tcloud label label-large label-primary" data-c="1" data-n="environment"> environment </span>

How can I use jquery to select for the values of the html5 data attributes?

$(document).ready(function() { $('span.tcloud').click( function () { console.log(this) // returns the above dom console.log($(this)) // returns an error console.log(this.data("data-c")) // returns Uncaught TypeError: Object #<HTMLSpanElement> has no method 'data'

user1721135 · Accepted Answer · 2013-07-12 06:56:36Z

1

Personally, I simply use

var values = $("element").attr("data-c");

answered Jul 12, 2013 at 6:56

user1721135

7,1128 gold badges39 silver badges67 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

JZ. Over a year ago

Uncaught TypeError: Object #<HTMLSpanElement> has no method 'attr' console.log(this.attr("data-c"))

Muneeb Nasir · Accepted Answer · 2013-07-12 06:57:08Z

you can get the value by using its id in following way.

 $('span.tcloud').click( function () { console.log( $('#element').val()); }

Collectives™ on Stack Overflow

Getting the values of HTML Data attributes with Jquery

2 Answers 2

1 Comment

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Related