特定の<span>を同じクラス名で選択するにはどうすればよいですか？

Question

このHTMLブロックからデータを抽出しようとしています。

<div class="group-capitalization-content field-group-html-element"> 
    <h2><span>Capitalization</span></h2> 
    <div class="item"> 
     <div class="label-inline">Issued &amp; Outstanding:&nbsp;</div> 
     <span class="number">242906121</span> 
    </div > 
    <div class="item"> 
     <div class="label-inline">Reserved for Issuance:&nbsp;</div> 
     <span class="number">51423534</span > 
    </div> 
</div> 

私は、HTMLからデータをこすりするcheerioと呼ばれるNPMモジュールを使用しています。したがって私は"numbers"を試してみるために以下のコードを持っています。一緒に添付の両方の結果である、24290612151423534：

var data = $('.group-capitalization-content .item .number').text(); 

このコード結果を実行します。

ここで個別の番号を選択するか、別々にするのですか？

Answer 1

上記の例がすべて必要な場合は、.eq()を使用してください。

まずアイテムのtext()は

$('.group-capitalization-content .item .number').eq(0).text(); 

です...そしてあなたがより複雑なケースを持っていて、後で、配列内のデータを格納する必要がある場合は、2番目は

$('.group-capitalization-content .item .number').eq(1).text(); 

あり、Iページ内の他の.numberの可能性を除外するために、$.map()（@Sushanth's answer）を使用してください：

let data = $.map(
    $('.group-capitalization-content .item .number'), 
    function(e){ return $(e).text() } 
); 

Answer 2

についてeach機能は次のように、検索結果の各通過する方法：

$('.group-capitalization-content .item .number').each(function(index, element) { 
    //your individual item code goes here 
    console.log(index + ": " + $(this).text()); 
}); 

Answer 3

あなたmap方法とは配列に内容を吐き出すます.numberクラスをターゲットにすることができます。

let data = $.map($('.number'), function(elem) { 
    return $(elem).text(); 
}); 

console.log(data); 

Answer 4

あなたが事前にわからない場合はどのように多くのあなたは、私が通常行うためにそれらの上のすべてのDOM要素と、ループを.each

$('.group-capitalization-content .item .number').each(function() { 
    $(this).text(); // Save this to a var or do something with it 
}); 

Answer 5

とそれらを介してループを得ることができますが存在します私の必要な機能。ここで働くフィドルです。 https://jsfiddle.net/bbmtk7tm/

var data = $('.group-capitalization-content .item .number'); 
for(var i=0; i<data.length;i++) 
{ 
console.log(data[i].innerHTML); 
} 

Answer 6

$('.group-capitalization-content>.item>.number').each(function(index, value){ 
 
    console.log('Number at '+index+': '+$(value).text()) 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="group-capitalization-content field-group-html-element"> 
 
    <h2><span>Capitalization</span></h2> 
 
    <div class="item"> 
 
     <div class="label-inline">Issued &amp; Outstanding:&nbsp;</div> 
 
     <span class="number">242906121</span> 
 
    </div > 
 
    <div class="item"> 
 
     <div class="label-inline">Reserved for Issuance:&nbsp;</div> 
 
     <span class="number">51423534</span > 
 
    </div> 
 
</div>