附加數據到元素

我正在構建一個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

附加數據到​​元素

回答

相關問題

附加數據到元素