Question

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

Prototype的$（'id'）。update（content）
jQuery的jQuery（'＃id'）。html（content）

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

BTW，两个库共存，我的应用程序没有冲突，因为我使用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开发提供了更自然的语法。它是以向某些核心类添加方法为代价的，但这也是红宝石的动机，这是常态。

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

Answer 2

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

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

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

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

Answer 3

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

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

3 个答案: