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()); 
    });