在jQuery中,$('li.item-ii')。find('li')与$('li.item-ii li')相同?

时间:2010-06-18 02:22:14

标签: jquery jquery-selectors

在jQuery的find()的例子中 (该文件位于http://api.jquery.com/find/

我想知道为什么我们需要它,因为,是

$('li.item-ii').find('li')

相同
$('li.item-ii li')

基本上,<li>元素中具有类<li>的所有item-ii元素

类似地

$('#id1').find(".class1 #id2")

相同
$('#id1 .class1 #id2")

更新:如果它们相同,为什么我们需要find()?是因为主要是当我们需要在变量中给出另一个元素时进一步选择一些元素,所以我们可以做elementFoo.find("...")

2 个答案:

答案 0 :(得分:4)

是的,这些是等价的。 结果是相同的,它被称为descendant selector。他们的实用程序略有不同(例如使用.end().andSelf()等),但只是选择元素,你就会找到相同的集合。

对于踢球,你也可以这样做:

$('li', 'li.item-ii')

为了您的编辑:为什么我们需要它?有时候你不是来自选择选择器,快速举例:

$(this).find('.childElementClass')

您需要多次找到相对的内容,而不是来自已知选择器(可能是DOM元素,thisiframe文档等)。此外还有许多其他traversal functions

答案 1 :(得分:1)

他们基本相同是的。但是,例如,如果您已经拥有DOM元素,那么它非常有用。比如说,你已经绑定了div上的click事件,并希望隐藏div中的所有跨度。它就像$(this).find('span').hide()一样简单,而用其他语法则很难。

有时候将$('li.item-ii')结果存储在一个变量中是有道理的,因为你想要运行多于1个查询(假设你想首先找到它下面的li,但也想找到那里也是)。这种语法允许您在每次要访问另一个子元素时不复制选择器,这对于可维护性来说明显更好(我相信在不重新运行基本选择器的情况下也可能有性能优势,但它可能取决于用例)。

简而言之,这是做同样事情的两种方法,但在不同情况下它们比另一种更合适。