在 jQuery 选择器中使用 jQuery 对象

Posted 2023-03-05

【中文标题】在 jQuery 选择器中使用 jQuery 对象

【英文标题】：Using jQuery objects in jQuery selectors

【发布时间】：2010-12-27 19:56:57

【问题描述】：

我对 jQuery 还很陌生，我想我可能会做一些比它需要的更难的事情。我有一个 jQuery 变量，它只是一个无序列表。它是这样声明的：

var $list = $('#activityList'); // activityList is ID of <ul>

我正在尝试使用我创建的变量选择该列表中的所有 <li> 元素：

$items = $('#' + $list.attr('id') + ' > li');

有谁知道是否有不同的语法来实现相同的事情而不必将变量分解为它的 id 属性？

谢谢。

澄清：我使用简化代码来提出问题，但我确实想在选择器中使用 jQuery 变量“$list”，而不是对 ID 进行硬编码。

【问题讨论】：

为什么要在变量前加上 $？

因为它可以更容易地识别带有大块 js 代码的 jQuery 对象。

谢谢，有道理

【参考方案1】：

$items = $('li', $list); 

这应该可以满足您的需求。

【讨论】：

实际上应该是 $('li', $list) - 在 li 之前没有 #。 :)

另外值得注意的是，您可以将 jQuery 对象或 DOM 对象作为上下文传递。

现在这个答案会让我只得到直接后代的li 元素，还是会检索所有祖先？如果我这样做会怎样：$items = $('> li', $list)。这行得通吗？

它将像普通上下文一样选择项目，除了它将被过滤到 context

的唯一子项和后代

另外，$list.find('li') 是等价的

【参考方案2】：

$("#activitylist > li") 会起作用，因为 > 遍历内容。您也可以将 $list 用作 JQuery 对象：

$list.find("li") 或 $list.children("li") 也可以查找列表项。如果您只寻找直系子女，children 会更有效率。

【讨论】：

+1 for find/children，因为它的功能等同于主要答案。

【参考方案3】：

试试这个：

var items = $('#activityList > li');

【参考方案4】：

也许我是误会了，但这是怎么回事……

var $items = $('#activityList > li'); 

【讨论】：

没什么问题，您只是已经拥有要在 ($list) 中搜索的上下文，那么为什么不保存一些处理并从那里开始呢？ ;)