jQuery獲取每個li的第一個跨度的文本

Question

我試圖在不同的li元素下獲取span的第一個值。我的HTML標記是如下...

<div class="mipartrel"> 
    <div class="k-multiselect-wrap k-floatwrap"> 
     <ul role="listbox" unselectable="on" class="k-reset"> 
      <li class="k-button"> 
       <span>bat</span> 
       <span class="k-icon k-delete">delete</span> 
      </li> 
      <li class="k-button"> 
       <span>ball</span> 
       <span class="k-icon k-delete">delete</span> 
      </li> 
     </ul> 
    </div> 
</div> 

我用下面的jQuery代碼來獲取所有span元素的文字...

var getdata=$('.mipartrel ul li span').first().text(); 

...但我只得到值"bat"。我需要每li的第一個span的每個值。

Answer 1

的first方法只返回第一個匹配元素，你可以使用find方法：

var textArray = $('.mipartrel ul li').find('span:first').map(function(){ 
    return $(this).text(); 
}).get(); // ["bat", "ball"] 

var textString = textArray.join(); // "bat, ball" 

http://jsfiddle.net/s797E/

或者：

var getdata = $('.mipartrel ul li').find('span:first').text(); 

Answer 2

使用first-child選擇，以獲得跨越那是他們父母的第一個孩子：

var getdata = $('.mipartrel ul li span:first-child').text(); 

演示：http://jsfiddle.net/Guffa/38NN5/

的text方法會得到所有元素作爲一個字符串文本。如果你想把它當作一個數組，你需要分別獲得各文本：

var getdata = $('.mipartrel ul li span:first-child').map(function(){ 
    return $(this).text(); 
}).get(); 

Answer 3

這裏是jsfiddle使用循環來獲取元素

$('ul.k-reset li').each(function(){ 
     var current = $(this).find('span:first'); 
     alert(current.text()); 
    });