javascript div長度，如果值大於

Question

我希望您獲得如何獲得div類的長度的幫助，例如，值> = 20

<td class="total">23</td>
<td class="total">12</td>
<td class="total">3</td>
<td class="total">42</td>

在我的示例中，我總共有4條記錄。 但結果應為2，因為只有2條記錄> = 20

這是我的嘗試：

   $(".total").each(function() {
      var val = $.trim( $(this).text() );
      if ( val >= 20) {
          val = parseFloat( val.replace( /^\$/, "" ) );
          length = $(".total").length // but this will show me all records which is not correct
          sum += !isNaN( val ) ? val : 0;
      }
    });
    console.log( sum );
    console.log( length );

Answer 1

您可以過濾其innerText大於20的單元格

 console.log( $('.total').filter((index,td)=>parseInt(td.innerText, 10)>=20).get() ); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <table><tr> <td class="total">23</td> <td class="total">12</td> <td class="total">3</td> <td class="total">42</td> </tr> </table> 

Answer 2

如果您的條件匹配，則應增加長度值

var length = 0;
 $(".total").each(function() {
      var val = $.trim( $(this).text() );
      if ( val >= 20) {
          val = parseFloat( val.replace( /^\$/, "" ) );
          length++;
          sum += !isNaN( val ) ? val : 0;
      }
    });
    console.log( sum );
    console.log( length );

Answer 3

您可以使用reduce創建一個包含sum和length的對象：

 let result = [...document.querySelectorAll('.total')].reduce((obj, itm) => { let val = parseFloat(itm.textContent) if(val >= 20) { obj.sum += val obj.length++ obj.items.push(itm) } return obj }, {sum: 0, length: 0, items: []}) console.log(result) 

 <table> <tr> <td class="total">23</td> <td class="total">12</td> <td class="total">3</td> <td class="total">42</td> </tr> </table>