jQuery – 为什么“活”效率低下?我们如何衡量呢?

前端之家收集整理的这篇文章主要介绍了jQuery – 为什么“活”效率低下?我们如何衡量呢?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
为什么程序员说“现场”效率低下?

>那么有什么选择呢
复制该功能方法
哪个更有效率?
>我们如何衡量减慢速度的影响?

解决方法

我认为这是低效的,因为处理程序放在根节点,并依赖冒泡来捕获事件并运行正确的处理程序.

另一种方法是在创建元素并将其添加到DOM时简单地将处理程序绑定到动态创建的元素.

另一种方法是将单个处理程序绑定到容器,并让您的事件冒泡到那个.如果您将大量相同的元素添加到容器中,这可能会很好.

<div id="myContainer">
    <div class="myElement>element</div>
    <div class="myElement>element</div>
    <div class="myElement>element</div>
    <div class="myElement>element</div>
</div>

将单击处理程序绑定到#myContainer而不是每个.myElement.

$('#myContainer').click(function(e) {
    $target = $(e.target);
    if($target.closest('.myElement').length) {
        // Run my code for the click
    }
});

我认为这可能会遇到与.live()相同的低效率,但应该更好,因为它更本地化.添加了新的.myElement项目,自动运行.

编辑:

根据the docs:从jQuery 1.4开始,事件冒泡可以选择在DOM元素“context”停止.

这似乎会产生与我提到的最后一种方法类似的效果.

编辑:

正如Nick Craver所建议的那样,jQuery的.delegate()方法可以更干净地产生类似的效果.

示例由Nick提供:

$('#myContainer').delegate('.myElement','click' function() { alert($(this).text()); });
原文链接:https://www.f2er.com/jquery/178333.html

猜你在找的jQuery相关文章