用于DOM操作的原型或jQuery（客户端动态内容）

Question

在性能，内存使用等方面，我需要知道这两个JavaScript框架中哪一个对于已知DOM元素（通过id）的客户端动态内容修改更好。

• Prototype的$（'id'）。更新（内容）
• jQuery的jQuery（'＃id'）。html（内容）

编辑：我在问题的最后澄清了我真正关心的问题。

顺便说一句，两个库共存，我的应用程序没有冲突，因为我使用RichFaces进行JSF开发，这就是为什么我可以使用“jQuery”而不是“$”。

我的页面中至少有20个可更新区域，每个我根据一些用户定义的客户端标准过滤或一些AJAX事件等准备内容（表格，选项列表等），如下所示：

var html = [];
int idx = 0;
...
html[idx++] = '<tr><td class="cell"><span class="link" title="View" onclick="myFunction(';
html[idx++] = param;
html[idx++] = ')"></span>';
html[idx++] = someText;
html[idx++] = '</td></tr>';
...

所以这里有一个问题，哪个更好用：

// Prototype's
$('myId').update(html.join(''));
// or jQuery's
jQuery('#myId').html(html.join(''));

其他所需的函数是hide（）和show（），它们存在于两个框架中。 哪个更好？ 此外，我需要启用/禁用表单控件，以及读取/设置其值。

请注意，我知道我的可更新区域的id（此时我不需要CSS选择器）。 我必须告诉我，我将这些查询的对象保存在某些数据结构中供以后使用，因此在呈现页面时只需要它们一次，如下所示：

MyData = {div1:jQuery('#id1'), div2:$('id2'), ...};
...
div1.update('content 1');
div2.html('content 2');

那么，这是最好的做法？

编辑：澄清，我最担心的是：

• 这些保存对象的内存使用情况（在我看来jQuery对象增加了太多开销），而OTOH我的DOM元素已经被Prototype的扩展修改（由Richfaces默认加载）。
• 更新DOM时的性能（时间）和内存泄漏（替换元素的垃圾收集？）。 从源代码中，我可以看到Prototype替换了innerHTML并使用内联脚本做了一些事情。 在替换内容之前调用“empty（）”时，jQuery似乎释放内存。

如果需要请纠正我...

Answer 1

你最好使用jQuery。 这两个框架都很棒（我同时使用它们），但在你的情况下，jQuery可能是赢家。

在我看来，原型为javascript开发提供了更自然的语法。 它是以向某些核心类添加方法为代价的，但这也是ruby的动机，这是常态。

另一方面，jQuery在dom操作和事件观察方面要优越得多。 在这些情况下，您的代码将更加简洁和易于管理，并将受益于事件委派等卓越的性能功能。 jQuery还有一个更大的社区和更多的插件和代码示例。

Answer 2

如果您只对“更新”，“隐藏”和“显示”三种基本方法感​​兴趣，那么jQuery更适合。 它更多地针对DOM操作，这正是您所需要的。 然后你可以用几行代码完成每一项工作，节省传输jQuery库所需的26KB。

由于你担心内存使用情况，请查看jQuery文件，它是77KB未压缩的，你认为浏览器执行的工作量是多少？ 可能远远超过在典型DIV上调用empty()所释放的内容。

并且你提到Prototype已经在网站上使用，在这种情况下你不应该添加另一个库。 jQuery的能力是Prototype的一个子集。

这个问题差不多一年了，所以你现在可能已经做出了决定。 对于其他人来说，阅读答案很简单; 如果没有破坏的东西不修复它，你已经安装了一个有能力的库，所以使用它。

Answer 3

我会去jQuery。 用于修改默认JS对象的原型，这很好，但这意味着你必须要小心。 我相信这不再是这种情况。 JQuery还有一个大型插件存储库和小部件的jquery UI扩展。 顺便说一句。 使用JQuery，您也可以使用熟悉的美元符号。