选择 div 的所有包含元素

Posted 2023-05-09

【中文标题】选择 div 的所有包含元素

【英文标题】：Select all containing elements of a div

【发布时间】：2012-05-18 20:16:32

【问题描述】：

我想选择容器中的所有元素，例如一个分区。容器中的元素类型无关紧要，并且应该可以选择那些没有分配任何类的元素，以尽可能保持灵活性。 我想将这个快速编写的“logo-ticker”构建为一个 jQuery 插件：

http://apkunden.de/dev/index.html

我们的目标是使它可以与任何 html 元素一起使用，而不仅仅是 imgs。我知道实现此目的的一种非常常见的方法是使用分配给任何相关元素的类。但事实证明我是一个懒惰的人，我不想分配所有这些类：D。

现在我知道 jQuery 中有 all 选择器（“*”），我想做这样的事情：

    $("#container").find("*");

但是随后在 jQuery API 页面上出现了一个警告，即 all 选择器非常慢。现在的问题是，使用 ("*") 选择器是否有意义。如果它对性能有那么大的影响，我宁愿不要偷懒......

谁有这方面的经验或建议？

谢谢。

【参考方案1】：

来自 JQuery 规范 (link)：

.children([选择器])

描述：获取匹配元素集中每个元素的子元素，可选地由选择器过滤。

所以在你的情况下：

 $("#container").children();

【参考方案2】：

来自同一个docs（强调我的）：

注意：全部或通用选择器非常慢，除非单独使用。

这句话暗示$(this).find('* > p') 比$(this).find('*') 慢得多，所以我认为这样做很安全，老实说我想不出更好的方法（如高效），因为您的要求是@ 987654325@

编辑：

根据我的评论，来自children() 文档：

.children() 方法与 .find() 的不同之处仅在于 .children() 在 .find() 可以遍历时沿 DOM 树向下移动一层 向下多个级别选择后代元素（孙子， 等等）。

【讨论】：

好的，谢谢。我会测试它。我想我也会将性能与 .children() 选择器进行比较。

如果你打算只取你容器的direct子代，那你绝对可以用children()，但是如果你需要取container的所有后代，children()赢了不给你那些

是的，我认为 .children() 会更好地满足我的需求。 Thx，无论如何，对于您的回答，它让我更好地理解了 all 选择器。

仍然对性能感到好奇......也许我会互相测试一下。

@TimG 只需查看返回的结果集，children() 就比 find('*') 快，这是不言而喻的 ;) 请参阅此处的基准：jsperf.com/jaja-children-vs-find

【参考方案3】：

你可以使用

    $("#container").children() 

jquery 中的方法，你想循环遍历结果吗？子元素是否也包含子元素是否重要？

至于速度，如果使用 all 选择器，我会感到惊讶，它比任何其他选择器都慢，因为它们肯定是基于结果的数量。 （虽然可能是错误的）

【讨论】：

子元素不应该有更多的子元素（或者至少不应该选择它们），所以我想这可能比使用（“*”）更安全。最后，我需要子元素的宽度将它们全部添加到总代码宽度。