jQuery：选择器混乱

Question

这个jQuery选择器出了什么问题？

$("#masterHeaderMenu.masterHeaderMenuButton a:first")

我打算选择第一个锚标签，该标签是类为“masterHeaderMenuButton”的元素的子元素，它本身是元素的子元素，其属性值为“id” masterHeaderMenu”。

我不能在jQuery中这样做吗？

Answer 1

你需要一个额外的空间，如下所示：

$("#masterHeaderMenu .masterHeaderMenuButton a:first")

如果没有这个空格，#masterHeaderMenu.masterHeaderMenuButton正在寻找一个包含id="masterHeaderMeny" 和 class="masterHeaderMenuButton"的元素，其中包含空格，就是说class="masterHeaderMenuButton"那是#masterHeaderMeny的后代，而不是同一个元素。

如果你想降低任意数量的级别，请添加一个空格，如果你想要仅一个级别，请使用>，这意味着只有直接的孩子

Answer 2

你可以。您需要在第一个元素（ID）和第二个元素（类）之间留一个空格：

$("#masterHeaderMenu .masterHeaderMenuButton a:first")

您的选择器查找ID为“masterHeaderMenu”和 CSS类“masterHeaderMenuButton”的元素。

Answer 3

无需指定类。如果你在选择器中给出ID名就足够了。 ID可以表示文档中的单个html元素。但是该类可以表示一组html元素。

$("#masterHeaderMenu .masterHeaderMenuButton a:first")

这个选择器可能需要时间。 可以从此代码$("#masterHeaderMenu a:first")

获得相同的结果