jQuery - 如何知道选择器是否应该有＃或。或类似的东西？

Question

我正在学习jQuery，我的课中的一些问题一直让我做选择器练习。

这可能是海拉的基本，但我怎么知道，如果我选择的具体的HTML或CSS元素要求它是$('#element')或$('.element')而不是只有$('element')？

Answer 1

jQuery（和DOM功能document.querySelector和document.querySelectorAll）正在使用CSS selectors从DOM中选择元素。

所以基本上你看（一）HTML元素（S），并设法找到的东西，如果你想要一个特定的按钮标识元素（一个或多个），比如：

<button id="login">Login</button> 

您可以使用它id。 ID根据定义在页面上是唯一的，所以你总能得到那个按钮（或者如果ID不同或按钮不存在）。 “id”选择器在实际ID前是#，因此您在此处使用#login。

但是如果你想选择多个相似的项目呢？例如：

<li class="menu-item">Home</li> 
<li class="menu-item">Shop</li> 
<li class="menu-button">Logout</li> 

如果你希望所有的menu-item元素，但不是menu-button？ 这次你可以使用他们的class属性。类选择器的前缀为.，因此您可以使用.menu-item来选择这两个元素。

还有很多其他元素和CSS有相当多的语法。下面是几个例子：

• 您可以通过元素的标记名选择：button选择所有<button>元素
• 您可以通过任何属性选择：button[disabled]选择与disabled所有按钮的属性一样<button disabled>n/a</button>
• 你可以根据其父级选择：li img选择所有直接嵌入在<li>元素中的图像

我高度r建议阅读MDN文章以获取更多信息。