有$（document）.find（'selector'）和$（'selector'）的区别

Question

我已经开始研究某个项目，在代码中我找到了$（document）.find（'selector'）和$（'selector'）的组合。我找不到为什么这样做的真正原因。我这两者之间是否存在显着差异，以便在项目中同时使用它们？在某些情况下我应该先选择一个吗？

Answer 1

$(document).find("selector")和$("selector")将匹配相同的元素集。

没有理由仅$(document).find("selector")使用$("selector")（除非您使用的选择器来自不受信任的来源 - 稍后会详细介绍），以及几个原因没有：

1. 写作时间更长，阅读更难熬，夸大脚本大小

2. 导致更多内存流失（创建/销毁更多临时对象）

3. 速度较慢 - http://jsperf.com/vs-document-find，http://jsperf.com/selector-vs-find-again



但是，如果$(selector) selector来自不受信任的来源，请注意jQuery会嗅探字符串， 选择或创建新的HTML元素。也就是说，$("div")查找div，但$("<div>") 创建 div。如果您使用的文字来自不受信任的来源，则可能是<script src='http://example.com/path/to/malicious/script.js>。现在，它本身不会成为问题，但如果将生成的script元素添加到文档中（例如，$(selector).appendTo(document.body)），则突然它是XSS attack向量。可能性有多大？不，如果你选择，那么你就不太可能追加了（尽管如果你是移动元素的话）。但是，如果选择器来自不受信任的来源，$(document).find(selector)可确保文本仅 用作选择器，而不是HTML字符串。或者，在现代浏览器上$(document.querySelectorAll(selector))（但你不能以这种方式使用jQuery对选择器的扩展）。

Answer 2

它们在功能上是等同的。 $("selector")，$(document).find("selector")和$("selector", document)之间的行为没有区别。

至于性能，一些变体可能比其他变体稍慢（因为这些方法是根据其他变体实现的）。但是，这是一个实现细节，可能会在发行版之间发生变化。对特定版本进行基准测试可以肯定。

Answer 3

$(document).find(selector)和$(selector)都在搜索文档中的选择器。

Answer 4

问题的确切答案是“是”两者之间存在差异。尽管两者都指向/选择元素的工作相同。

加载文档时，会定义jQuery作用域。因此，通常使用$（＆＃39; selector＆＃39;）来指向元素。

但是如果在定义此范围后添加了元素，该怎么办呢？即如果元素是通过ajax调用加载的。 jQuery无法找到这些元素。因此，为了指向这些元素，我们使用替代函数$（＆＃39;范围＆＃39;）。find（＆＃39; selector＆＃39;）。

最佳实践：如果您在加载文档后未添加元素。不要使用＆＃34; $（＆＃39;范围＆＃39;）。找到（＆＃39;选择器＆＃39;）＆＃34;方法。由于给定的名称将被视为标准，并且根据查找功能，将检查每个元素以匹配将消耗更多时间的标准，并且将比直接指向方法需要更多资源。

Answer 5

主要区别在于，当您动态生成诸如div文本框之类的东西时，而您的真实DOM对此一无所知，因此，如果您编写$（'selector'），则不会影响或找不到什么都可以。在这种情况下，您需要向javascript指定要添加的内容，因此请在所有dom中检查此选择器，因此使用

$(document).find("selector")

将在您的整个dom中找到元素。