如何修改此代码以便文档每次都搜索它？答案

【问题标题】：How do I modify this code so that the document searches for it every time?如何修改此代码以便文档每次都搜索它？
【发布时间】：2015-09-04 11:57:43
【问题描述】：

如何修改以下 3 行代码，以便它们使用 $(document) ？

    $('.navbar li ul').slideToggle(300);

和

    $('.navbar > li:first-child > span').text("Category");

和

    if (!container.is(e.target)

文档使用示例：

    document.getElementById("input1").focus();

和

    $(document).on('click', '.navbar ul span', function(event) {    
    });

和

    $(document).mouseup(function (e) { 
    });

等等……

【问题讨论】：

你介意添加完整的代码，而不是块。另外，添加最少的 HTML
“让他们使用$(document)”是什么意思？您所有的 jQuery 选择器都已经搜索了文档。 document.getElementById("input1") 相当于 jQuery 中的 $("#input1")。
所以它以 $(document) 开头，因为例如“ $('.navbar li ul').slideToggle(300);”不以文档开头。
为什么要以$(document)开头？这是没有意义的。您可以使用它需要开始的内容来启动选择器，以便找到您正在寻找的元素。在 jQuery 中，所有没有特别指定上下文的选择器已经搜索了整个文档。
@matthew 预期结果是什么？

【解决方案1】：

看来您对 jQuery 选择器有点困惑。

 $('.navbar li ul').slideToggle(300);

已经搜索了整个文档。如果省略 jQuery 对象的第二个参数，则它隐含为 document。所以，上面的选择器等价于：

 $('.navbar li ul', document).slideToggle(300);

省略document 作为第二个参数是一种快捷方式。如果不存在，则默认由 jQuery 库假定。

类似这样的：

document.getElementById("input1")

是一个简单的 Javascript 语句 - 没有 jQuery，没有 CSS 选择器。这是另一种通过id查找元素的方式，大致相当于jQuery语句：

$("#input1")

或纯 Javascript：

document.querySelector("#input1");

从您的 cmets 看来，您可能要问的是如何使用委托事件处理，以便您的查询可以处理动态创建的元素。如果是这种情况，您应该编辑您的问题以实际说出这一点。以后，请描述您要解决的问题，而不是您尝试的解决方案。然后，我们可以更全面地帮助您。

如果是这种情况，那么你可以使用这个，那么委托事件处理只适用于事件处理程序，它不适用于一次性命令，例如：

$('.navbar li ul').slideToggle(300);

这将适用于您运行它时存在的任何元素，并且没有 document 等效项或任何方法可以使动态元素更好或更差地工作。它适用于您调用它时存在的任何元素，因为它不是未来事件的事件处理程序安装。这是您在特定时刻执行的操作，因此它只能对当前存在的元素起作用。

您可能会发现这些其他答案有助于了解有关这些问题的更多信息：

【讨论】：

谢谢。我从你的帖子中学到了一些东西。是的，委托事件处理是我想要做的。你对此有什么额外的建议吗？编辑：现在阅读您针对此主题的编辑。谢谢！
@matthew - 委托事件处理仅适用于事件处理程序，而不适用于您问题中的前四个代码块，因为这些是对当前存在且与事件没有任何关系的元素的操作处理，因此也与委托事件处理没有任何关系。请参阅我添加到答案末尾的参考资料。
@jfriend00 非常感谢！