jQuery找不到現有元素

Question

我有以下問題，我的網站上有一個下拉列表。 但是，因為我想為其添加樣式，所以我將其隱藏並在其上方顯示bootstrap下拉菜單。
這是我的html結構：

<div class="input-box">
    <select name="super_attribute[139]" id="attribute139" class="required-entry super-attribute-  select selectpicker" style="display: none;">
        <option value="">Maat_dames</option>
        <option value="44" price="0">s</option>
        <option value="43" price="0">m</option>
        <option value="42" price="0">l</option>
        <option value="41" price="0">xl</option>
        <option value="40" price="0">2xl</option>
        <option value="39" price="0">3xl</option>
        <option value="38" price="0">4xl</option>
    </select>
   <!-- The normal dropdown -->

   <!-- The bootstrap dropdown -->
   <div class="btn-group bootstrap-select required-entry super-attribute-select">
       <button type="button" class="btn dropdown-toggle selectpicker btn-default" data-toggle="dropdown" data-id="attribute139" title="Maat_dames">
           <span class="filter-option pull-left">Maat_dames</span>
           <span class="caret"></span>
       </button>
       <div class="dropdown-menu open">
           <ul class="dropdown-menu inner selectpicker" role="menu">
               <li data-original-index="0" class="selected">
                    <a tabindex="0" class="" data-normalized-text="<span class=&quot;text&quot;>Maat_dames</span>">
                         <span class="text">Maat_dames</span>
                         <span class="glyphicon glyphicon-ok check-mark"></span>
                    </a>
                </li>
           </ul>
      </div>
  </div>

我正在嘗試將文本Maat_dames更改為Maat ，我嘗試了以下jQuery代碼：

if(jQuery('span .filter-option').length == 0){console.log("fail")}
if(jQuery('span .filter-option.pull-left').length == 0){console.log("fail")}
if(jQuery('span .filter-option .pull-left').length == 0){console.log("fail")}

當我檢查控制台日志時，在所有三種情況下均返回失敗，因此未找到該元素。 為什么會這樣？

編輯

所有答案都建議刪除span和.filter-option之間的空間，盡管它在我的網站上不起作用，但當我嘗試在JSFiddle中嘗試重新創建注釋時，當我嘗試在注釋中運行代碼段時，它確實起作用。

jQuery是否由於插件動態創建元素而無法找到元素？

Answer 1

您正在使用后代組合器 （空格）。

span .filter-option表示屬於類filter-option且其祖先為span的任何元素。

在您的文檔中，屬於該類的成員的唯一元素是spans本身，而祖先也不是spans。

從選擇器中刪除空格。

 if(jQuery('span.filter-option').length == 0){console.log("fail")}else{console.log('success'); } if(jQuery('span.filter-option.pull-left').length == 0){console.log("fail")}else{console.log('success'); } if(jQuery('span.filter-option.pull-left').length == 0){console.log("fail")}else{console.log('success'); } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <div class="input-box"> <select name="super_attribute[139]" id="attribute139" class="required-entry super-attribute- select selectpicker" style="display: none;"> <option value="">Maat_dames</option> <option value="44" price="0">s</option> <option value="43" price="0">m</option> <option value="42" price="0">l</option> <option value="41" price="0">xl</option> <option value="40" price="0">2xl</option> <option value="39" price="0">3xl</option> <option value="38" price="0">4xl</option> </select> <!-- The normal dropdown --> <!-- The bootstrap dropdown --> <div class="btn-group bootstrap-select required-entry super-attribute-select"> <button type="button" class="btn dropdown-toggle selectpicker btn-default" data-toggle="dropdown" data-id="attribute139" title="Maat_dames"> <span class="filter-option pull-left">Maat_dames</span> <span class="caret"></span> </button> <div class="dropdown-menu open"> <ul class="dropdown-menu inner selectpicker" role="menu"> <li data-original-index="0" class="selected"> <a tabindex="0" class="" data-normalized-text="<span class=&quot;text&quot;>Maat_dames</span>"> <span class="text">Maat_dames</span> <span class="glyphicon glyphicon-ok check-mark"></span> </a> </li> </ul> </div> </div> 

Answer 2

用jQuery('span .filter-option')替換jQuery('span .filter-option') jQuery('span.filter-option') 。

當前， jQuery('span .filter-option')正在DOM中的span標簽中查找帶有filter-oprion類的元素。

當您編寫jQuery('span.filter-option') ，它將在DOM中找到帶有類filter-option的 span元素。

Answer 3

('span.filter-option').length可能嗎？