Question

我正在使用jQuery。我在遍历普通表元素时没有问题，但我被困在这里：

<div id="compare-prices" class="" style="display:block;">
    <table cellspacing="0">
        <tbody>
            <tr class="stock_4 featured">
                <td class="store-logo">
                    <div>
                        <a href="" title="Lenovo K6 Power 32 GB (Grey) 3GB RAM, Dual SIM 4G" target="_blank" rel="nofollow" data-esnm="Tata Cliq (200)">
                            <img src="img/s/tatacliq.png" alt="Tata Cliq">
                            <div class="variant">
                                <table cellspacing="0">
                                    <tbody>
                                        <tr class="stock_4">

                                            <td class="name">
                                                <a href="" title="Redmi Note 4 (Dark Grey, 64 GB)" target="_blank">
                                                </a>
                                            </td>
                                            <td class="price">Rs. 12,999 </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </a>
                    </div>
                </td>
                <td class="price">
                    <div>Rs. 9,085</div>
                </td>
            </tr>
            <tr class="stock_4 featured">
                <td class="store-logo">
                    <div>
                        <a href="" title="Lenovo K6 Power (Grey, 32 GB)" target="_blank" rel="nofollow" data-esnm="Flipkart (9)">
                            <img src="img/s/flipkart.png" alt="Flipkart">
                        </a>
                    </div>
                </td>
                <td>
                    <td class="price">
                        <div>Rs. 9,999</div>
                    </td>
            </tr>
        </tbody>
    </table>
</div>

那我怎样才能解析主表中的信息而不是div > variant表中的信息。虽然它具有相同的tr类？

我这样想：

$('.stock_4').closest('#compare-prices').each(function() {
    console.log($(this).find('.price').text());
});

但它也给出了div＆gt;变量表的价格。

Answer 1

use immediate child selector 
 ***>***

    $('#mainTable > tbody  > tr').each(function(index , item) {
        var itemsrc = $(item).find('img').attr("src")  // will give src
        var price  = $(item).find('.price div').text()  // will give price

        console.log(itemsrc ,price );
    })



Please have a look on the entire solution

  $(document).ready(function(){
   $('#mainTable > tbody  > tr').each(function(index , item) {
		var itemsrc = $(item).find('img').attr("src")  // will give src
		var price  = $(item).find('.price div').text()  // will give price
		
		console.log(itemsrc ,price );
	})
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="compare-prices" class="" style="display:block;">
    <table id="mainTable" cellspacing="0"  border="1">
        <tbody>
            <tr class="stock_4 featured">
                <td class="store-logo">
                    <div>
                        <a href="" title="Lenovo K6 Power 32 GB (Grey) 3GB RAM, Dual SIM 4G" target="_blank" rel="nofollow" data-esnm="Tata Cliq (200)">
                            <img src="img/s/tatacliq.png" alt="Tata Cliq">
                            <div class="variant">
                                <table cellspacing="0">
                                    <tbody>
                                        <tr class="stock_4">

                                            <td class="name">
                                                <a href="" title="Redmi Note 4 (Dark Grey, 64 GB)" target="_blank">
                                                </a>
                                            </td>
                                            <td class="price">Rs. 12,999 </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </a>
                    </div>
                </td>
                <td class="price">
                    <div>Rs. 9,085</div>
                </td>
            </tr>
            <tr class="stock_4 featured">
                <td class="store-logo">
                    <div>
                        <a href="" title="Lenovo K6 Power (Grey, 32 GB)" target="_blank" rel="nofollow" data-esnm="Flipkart (9)">
                            <img src="img/s/flipkart.png" alt="Flipkart">
                        </a>
                    </div>
                </td>
                <td>
                    <td class="price">
                        <div>Rs. 9,999</div>
                    </td>
            </tr>
        </tbody>
    </table>
</div>

如何遍历div下的jquery中的表元素

1 个答案: