在HTML中存储任意数据

Question

将数据嵌入html元素以供以后使用的最佳方法是什么？

举个例子,假设我们让jQuery从服务器返回一些JSON,我们想把这个数据作为段落转发给用户.但是,我们希望能够将元数据附加到这些元素,因此我们可以在以后为这些元素添加事件.

我倾向于处理这个问题的方式是使用一些丑陋的前缀

function handle_response(data) {
    var html = '';
    for (var i in data) {
        html += '<p id="prefix_' + data[i].id + '">' + data[i].message + '</p>';
    }
    jQuery('#log').html(html).find('p').click(function(){
            alert('The ID is: ' + $(this).attr('id').substr(7));
    });
}

或者,可以在段落中构建表单,并将元数据存储在那里.但是,这通常感觉有点矫枉过正.

以前曾以不同的方式询问过这个问题,但我觉得它没有得到很好的解答:

• 如何为某些HTML标记存储任意数据
• HTML标记上的非标准属性.好事？坏事？你的意见？

Answer 1

HTML5现在支持data-name存储没有非标准自定义属性的abitrary数据的语法

如果您的doctype不是HTML5(尽管有解决方法),这当然会破坏验证,但它不会影响我遇到的任何浏览器中的呈现或解析.

这是John Resig关于此事的一篇优秀文章