附加数据到元素

我正在构建一个web界面来编辑大表中的值（2600 x 2600）。由于表格非常大，我只将表格的一部分加载到浏览器中，用户可以通过指定xmin，xmax，ymin和ymax值来查看表格的小窗口。将x，y坐标附加到我显示的每个标记以反映单元格在大表格中的实际坐标的最佳方法是什么？我已经研究过jQuery.data（）函数，但不清楚如何将其用于此目的。附加数据到元素

来源

2012-01-25 anonymous_startup

如果你想使用jQuery.data()只是属性添加到您的HTML标记，像这样：

<td data-x="..." data-y="...">

然后，您可以访问这些值，具有：

$(element).data('x'); // where element is an td element, you somehow selected

来源

2012-01-25 15:53:56 Yoshi

没有意识到你可以做到这一点的标记。很高兴知道。它是否有效XHTML？ –

这些是有效的HTML5数据属性：https：//developer.mozilla.org/en/HTML/Global_attributes。他们很好用，很容易。他们创造了更多的开销，所以如果你有很多很多的元素，你可能会想要使用'$ .data（）'。 – Jasper

@Grim不幸的是它只在html5中有效。但至少它是格式良好的。 ;） – Yoshi

$.data是最好的方法，它是比$().data()快得多：

$.data(DOMelement, data-title, data-value);

因此，例如，你可以使用this在事件处理中：

$.data(this, 'some-key', 'some-value');

的$.data棘手的部分是，你必须使用一个DOM元素作为第一个参数。这意味着如果你有一个jQuery对象，你必须这样做：

$.data($jQueryObject[0], 'some-key', 'some-value');

来源

2012-01-25 15:56:05 Jasper

答案很大程度上取决于你将如何处理这些数据。你是否经常从元素中寻找数据？你经常在寻找一个基于坐标的元素吗？

对于在大型数据集中的性能，我通常会使用JavaScript - 而不是jQuery。仅适用于（x，y）数据的理想可能是使用数组，每个元素包含索引数据。像这样：

// Each element in array y contains the x index's data object 
var y = [ [{}, {}, {}, {}, {}], [{}, {}, {}, { key: 'value' }, {}] ]; 

// To get the element at (4, 2) (this will be not-so-fast) 
// NOTE: There are faster ways to get this element 
var xy = $('table tr:eq(1) td:eq(3)'); 

// To get the data of (4, 2) (this will be super fast) 
var dataOfFourThree = y[1][3]; // { key: 'value' }

如果您有可能在纯JS中反映DOM数据，那么总会有性能提升。

来源

2012-01-25 16:28:32 Simeon

附加数据到​​元素

回答

相关问题

附加数据到元素