0

因此，您可以通过附加将 html 添加到文档中。

$game.append('<div data-letter="A">A</div>');

或者你可以：

var game = document.getElementById('game');
var div = document.createElement('div');
$(div).data('letter', 'A');
game.appendChild(div);

我的问题是这些方法中哪一种更可取。

我正在使用数据属性来提高速度，目前我正在使用前一个示例 (.append())。它工作正常。

但是，当我像这样动态更改此元素的数据时：

$(this).data('letter', 'U');

它会更改元素存储在内存中的数据，但不会更新属性。此示例中的属性将保留为“data-letter="A"”。再一次，一切都在幕后工作得很好，当我调用 $(this).data('letter') 时，我得到了字母'U'。但这让我质疑我是否应该避免使用数据属性。属性是否在附加时读取一次，然后上传到内存中，然后属性就死了。还是在找不到 .data() 时读取属性？

我担心是否是后者，因为那不会提供最佳的速度性能。我想确保在附加元素时将所有内容上传到内存中。

4

1 回答 1

2

当您无法使用该data功能时，这些属性很有用：

  • 生成 HTML 服务器端时
  • 一次生成一大堆 HTML 时

在其他情况下，没有理由更喜欢将数据作为 HTML 字符串中的属性传递：它只需要更多的解析。

请注意，您使用 jQuery 的方式有些冗长。你可以减少

var game = document.getElementById('game');
var div = document.createElement('div');
$(div).data('letter', 'A');
game.appendChild(div);

到

$('#game').append($('<div>', {data: {letter:'A'}}));
于 2013-03-19T15:20:58.437 回答