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文章以獲取更多信息。