使用jQuery读取不引人注目的数据

Question

我找不到任何示例如何使用jQuery读取不引人注目的数据。例如以下

<a id="deleteFile" href="" data="123">Delete file</a>

我想从元素读取data属性。如何做？

Answer 1

您应该使用 data-*，其中 *是要使用的键：

<a id="deleteFile" href="" data-file-id="123">Delete file</a>

然后您可以阅读：

$('#deleteFile').data('fileId');

您会注意到该属性已从file-id转换为fileId，这会自动发生以符合规格。还应注意的是，jQuery将尝试将一个值转换为其JavaScript本地类型。这意味着该访问的值将是JavaScript Number，而不是S字符串。如果您有领先的0，并且将01转换为1，则可能会产生影响。如果您明确需要该值作为字符串，请使用attr：

$('#deleteFile').attr('data-file-id');

您还应该注意，使用attr时，您将提供完整的属性名称AS-I，而不仅仅是Camelcase中的数据属性名称。

Answer 2

最好的方法是获取元素属性

$('#deleteFile').attr('data');

如果您使用的是Newish jQuery库版本（高于1.6 I Belive），也可以使用JQuery的data()使用HTML5数据属性。将锚链接更改为

之类的东西

<a id="deleteFile" href="" data-fileid="123">Delete file</a>

然后您可以使用

$('#deleteFile').data('fileid');

但是不要互换使用它们，只使用一种方法，否则您以后可能会出现问题，因为Jquerys data()只会读取数据属性，然后将它们存储在内部缓存中。如果您通过data()更改任何内容，则不会在实际标签属性中更改它，这意味着data()和attr()将返回不同的结果

Answer 3

最好定义这样的数据属性：

<a id="deleteFile" href="" data-id="123">Delete file</a>

然后您可以阅读：

var id = $('#deleteFile').data('id');

在这种情况下使用attr并不是真正的好主意。

Answer 4

如果要坚持编码，则可以尝试此

var a = $("#deleteFile").attr("data");

HERES演示http://jsfiddle.net/ht7eg/3/