如何在 jQuery 中使用多个选择器？答案

【问题标题】：How do I use multiple selectors in jQuery?如何在 jQuery 中使用多个选择器？
【发布时间】：2009-07-07 22:28:28
【问题描述】：

我正在使用以下代码将悬停效果应用于名为工具栏的 div 中的一组图像：

$("#toolbar img").hover(
    function()
    {
        this.src = this.src.replace("_off", "_on");
    },
    function()
    {
        this.src = this.src.replace("_on", "_off");
    }
);

但我也想将相同的效果应用于名为 tabs 的 div 而不重复相同的代码。我不能按照这些思路做点什么：

$("#toolbar, #tabs img").hover(
    function()
    {
        this.src = this.src.replace("_off", "_on");
    },
    function()
    {
        this.src = this.src.replace("_on", "_off");
    }
);

问题是上述仅适用于“选项卡” div，而工具栏停止工作。我想我只是弄错了 jQuery 语法，对 jQuery 来说还是个新手

【问题讨论】：

标签： javascript jquery

【解决方案1】：

您像以前一样用逗号分隔多个选择器。如果您想重新创建第一个示例中的效果，则需要：

$("#toolbar img, #tabs img")

'#toolbar img' 是整个选择器。它说“将其应用于具有工具栏 id 的父元素中的任何 img 标签”。例如：

<div id ="toolbar">
   <img .../>
   <img .../>
</div>

#tabs img，是一个完全不同的选择器。

这些与 CSS 选择器的语法相同，因此有关更多信息的研究。

【讨论】：

【解决方案2】：

试试$("#toolbar img, #tabs img")。

【讨论】：

【解决方案3】：

不应该有“#toolbar img, #tabs”而不是“#toolbar, #tabs img”吗？

【讨论】：