从页面上所有表中的某些单元格中获取值

Question

我想检索页面上所有此类div的div ID和相关的价格数据（在div内的表中）。

示例：

<div class="post">
<div id="productdetail-0001"> <!-- ID -->
<table class="detailProduk">
  <tr>
    <th></th>
    <th class="priceData">290000</th> <!-- price -->
  </tr>
  <tr>
    <td></td>
    <td class="stock">9</td>
  </tr>
</table>
</div>
</div>

<div class="post">
<div id="productdetail-0002"><!-- ID -->
<table class="detailProduk">
  <tr>
    <th></th>
    <th class="priceData">159000</th><!-- price -->
  </tr>
  <tr>
    <td></td>
    <td class="stock">9</td>
  </tr>
</table>
</div>
</div>

该页面上有两个相同的price表，但它们位于不同的div中：id productdetail-0001和productdetail-0002 –每个价格都有不同的值。

我想获取内容“价格” 0001 或“价格” 0002

然后将其显示在此元素中

<div class="price">
</div>

这是我的jquery：

$(document).each(function(){
   var harga = $( ".priceData" ).html();
   $( ".price" ).html( harga );
});

有更好的方法吗？

Answer 1

类似的事情可能会让您入门：

$('.priceData').each(function(i,v){
  let divid = $(v).closest('[id^=productdetail-]').attr('id');
  let id = divid.split('-')[1];
  let prx = $(v).text();
  let currprx = $('.price').html();
  if (currprx == ''){
    $('.price').html(id + '---' + prx);
  }else{
    $('.price').html(currprx + "\n" + id + '---' + prx);
  }
  //alert(id +'--'+ prx);
});

table{border-collapse:collapse;}
th,td{border:1px solid #ccc;}

.price{max-width:100px;margin-top:20px;padding:5px;}
.price{background:wheat;border:1px solid orange;}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

<div class="post">
    <div id="productdetail-0001"> <!-- ID -->
        <table class="detailProduk">
            <tr>
                <th></th>
                <th class="priceData">290000</th> <!-- price -->
            </tr>
            <tr>
                <td></td>
                <td class="stock">9</td>
            </tr>
        </table>
    </div>
</div>

<div class="post">
    <div id="productdetail-0002"><!-- ID -->
        <table class="detailProduk">
            <tr>
                <th></th>
                <th class="priceData">159000</th><!-- price -->
            </tr>
            <tr>
                <td></td>
                <td class="stock">9</td>
            </tr>
        </table>
    </div>
</div>
<div class="price">
</div>