使用不属于的属性（HTML）[重复]答案

【问题标题】：Using attributes that don't belong (HTML) [duplicate]使用不属于的属性（HTML）[重复]
【发布时间】：2013-08-07 20:30:45
【问题描述】：

假设我有一个这样的表：

<table>
<tr>
<td>My House </td>
<td>My Car </td>
</tr>
</table>

使用 jquery，如果您单击其中一个，我希望它显示该项目的值。是否可以将附加信息存储在 value 之类的属性中，然后使用 .attr() 获取它

【问题讨论】：

标签： jquery html

【解决方案1】：

jQuery 有.data() 用于应用数据。还有data-xxxx 属性用于存储数据，同时保持您的HTML 有效。无论哪种方法更适合您！

【讨论】：

【解决方案2】：

只要您有 HTML5 Doctype，页面仍然会验证，您可以使用 data- 属性。见jQuery data 和data attributes。

所以有了这个标记：

<table id="data-table">
    <tr>
        <td data-value="house">My House </td>
        <td data-value="car">My Car </td>
    </tr>
</table>

类似这样的：

$(function(){
    $('#data-table').on('click', 'td', function(){
        var val = $(this).data('value');
    });
});

【讨论】：

【解决方案3】：

Sure, you can do a bunch of things that way.

【讨论】：

【解决方案4】：

您可以这样做，但最佳做法是为其使用一些特定的属性名称，例如 rel 或（甚至更好）使用 data 属性。

使用rel的示例：

<td rel="123">My House</td>

使用data 的示例（对 JQuery 更友好）：

<td data-value="123">My House</td>

对于最后一个示例，您可以使用以下命令，而不是使用 JQuery 的 attr 函数检索值：

$(elem).data("value")

还要设置你做的值：

$(elem).data("value", "new_value")

您可以在同一个元素中拥有多个数据属性。

【讨论】：