javascript - 使用 jQuery 获取数据属性

Question

一个<img />元素有一个data-id我想使用 jQuery 检索的属性。我相信该.data()功能可以做到这一点。

$('.photo').get(0).data('id')

问题：当我尝试使用.data('id')来检索属性时，我收到错误：

Uncaught TypeError: Object #<HTMLImageElement> has no method 'data'

我哪里做错了？

jsfiddle：http: //jsfiddle.net/KLG3R/

score 5 · Accepted Answer

就像其他人说的那样，您的问题是.get(0)返回 HTML 元素本身，而不是 jquery 对象。要获取某个元素，请使用:eq伪选择器，例如：

$('#result').html( $('.photo:eq(0)').data('id') );

score 0 · Accepted Answer

您需要对 jquery 对象使用数据，并且 get(0) 将返回该元素。

$('#result').html( $('.photo').data('id') );

检查下面的小提琴

score 0 · Accepted Answer

$('.photo').get(0)将返回HTMLImageElement，而不是 jQuery 对象，因此它没有方法.data。

你应该这样做：$('.photo').data('id')

score 0 · Accepted Answer

0

使用 .attr() 函数。像

$('#result').html( $('.photo').attr('data-id') );

于 2012-12-17T03:22:09.380 回答

score 0 · Accepted Answer

在这种情况下，.get()您需要使用 jQuery 。.eq()还有你的 using .data()which 用于在 dom 上存储数据。您需要使用.attr()which 可以访问元素的属性。

$(function () {
    var photos = $('.photo');
    $('#result').html(photos.eq(0).attr('data-id'));
});

这现在应该对你有用：http: //jsfiddle.net/KLG3R/4/

score 0 · Accepted Answer

6 回答 6