4

jQuery的背后delegate()和live()方法是什么让他们能够处理页面中当前和未来的元素？

4

3 回答 3

2

jQuery Live() 方法和事件冒泡

于 2010-12-20T07:40:59.477 回答
1

jQuery.live()和.delegate()方法的工作原理是事件可能会在 DOM 树中“冒泡”。这就是短篇小说，听起来很简单，其实很简单。具有类似的 DOM 结构

<html>
    <body>
        <div>
            <span>Foobar</span>
        </div>
    </body>
 </html>

例如，如果单击span，您的浏览器会检查是否有任何event handlers绑定到该跨度节点。如果是这样，他们将被解雇。如果这些事件处理程序不停止这样的被调用event propagation，则事件正在冒泡。这意味着您的浏览器将检查父div node级是否有任何事件处理程序click附加到它等等......

在冒泡的任何时候，事件处理程序都可以调用一个方法.stopPropagation()来防止该事件进一步冒泡。

现在 jQuery 的.live()方法将始终将事件处理程序（例如“点击”）绑定到<body>元素。这意味着click在页面某处发生的任何事件（因为所有其他节点都是 的子节点document.body）将冒泡到<body>，无论节点在调用时是否已经存在.live()或稍后添加。

该.delegate()方法更进一步。如果您正在处理一个非常庞大和深邃的 DOM 结构，那么让每个事件冒泡到整个树中似乎在性能方面很昂贵（而且确实如此！）。您可以.delegate()为新创建的节点指定一个公共父节点。例如，如果我们正在处理一个添加新li节点的无序列表，那么将任何事件处理程序附加到该<ul>节点就足够了。所有li节点都是子节点，因此它们的事件正在冒泡。

于 2010-12-20T08:13:41.217 回答
0

delegateand事件与live父元素或body元素相关联，而不是与它发生的特定元素相关联。

例如，当您单击一个元素时，单击事件会冒泡到元素的父元素并进一步向 body 元素冒泡，直到有一个处理它的 onclick 处理程序。如果你live用来连接一个点击事件，它会等到事件冒泡到 body 元素，在那里它会检查事件起源的元素是否与你指定的选择器匹配。

于 2010-12-20T08:26:05.453 回答