我最近需要将一些数据添加到动态创建的LI元素中。在我的第一个尝试中，我使用了类似于.data()的方法：
var _newli = $('<li>foobar</li>');
_newli.data('base', 'ball');
// append _newli to an `ul`
那个...非常缓慢。这个逻辑在一个循环中发生，可以轻松增加到500多个项目，需要很长时间！有时甚至会破坏JavaScript执行时间框架。
所以我改用$.data()。不知何故，使用这种方法将数据附加到对象上比通过.data()方法调用快8倍。所以现在它看起来像这样：
var _newli = $('<li>foobar</li>');
$.data(_newli[0], 'base', 'ball');
// append _newli to an `ul`
确实，这样做速度更快，但仍然需要大约3-4秒钟才能构建出所有元素（在我的实际代码中，每个元素都有6次对$.data的调用）。
因此，我真的被困在那里，我问自己为什么要使用.data()或$.data()？我可以将我的数据直接附加到DOM对象上。于是我这样做了。
var _newli = $('<li>foobar</li>');
_newli[0].base = 'ball';
// append _newli to an `ul`
看哪，wow我很震惊，这太快了！我简直不敢相信这个技术如此出色而没有任何缺点。所以这就是我的问题所在。实际上，我在网上还没有发现这种技术的任何缺点。有一些关于使用这种方式创建循环引用的文章，但据我所知，“只有”在IE上，并且只有在引用对象时才会出现。
专家们有什么想法吗？
更新
感谢大家的好评论和帖子。@patrick dw的简短更新：
你是对的，当使用$.data()时，我传递了底层的DOM元素。它甚至不能与jQuery对象一起使用，至少不符合预期。
我自己也有过使用一个对象并通过$.date()传递它的想法，但是由于性能差异太大，我决定永远忽略.data()方法。
$.data(_newli,'myvalues',{'base':'ball','basket':'ball','foot':'ball'});- user113716var data = $('selector').data(); data['foo'] = 'bar'; data['bar'] = 'foo';等方式，这样你只需要一次访问它。仅供参考。 - Felix Klingdata()包括变量分配，var data = $.data(_newli[0])，它会变化数据：0.040毫秒至0.225毫秒。 但这仅适用于分配一个属性。 分配多个属性将关闭其中一些差距（当存在时）。 在500个元素上使用$.data()，最慢的速度约为22ms。非常快。 再次强调，这仅适用于Webkit。 - user113716el["searchable"] = true;。 - hitautodestruct