将变量附加到HTML元素？

Question

我发现很多情况下我想将变量附加到div或其他HTML元素.例如,我有一个div,我正在使用它作为一个对话框窗口来编辑表中的一行 - 如下所示:

    <div class='dialog' id='editTableLineDialog'/>

打开此对话框时,我需要在我正在编辑的表中记录该行的ID.在过去,我创建了名为lineCurrentlyEditting(Yuck!)的全局变量,或者我将id嵌入到实际的表id中,如下所示:

    <div class='dialog' id='editTableLineDialog_43'/>

这两种解决方案都不是很优雅.我希望能够将变量添加到div中,如下所示:

    var dialog = document.getElementById('editTableLineDialog');
    dialog.tableLineId = 43;

要么

    $('#editTableLineDialog').tableLineId = 43;

要么

    <div meta='{tableLineId=43}' class='dialog' id='editTableLineDialog'/>

反正有没有做过这样的事情？处理这种情况的最佳方法是什么？JQuery有解决方案吗？

Answer 1

您可以使用数据属性.

<div data-tableLineId='43' class='dialog' id='editTableLineDialog'/>

jQuery有一个数据函数:(http://api.jquery.com/jQuery.data/)

$.data('#editTableLineDialog', 'tableLineId','43');