根据类的子类选择一个节点,并将其转换为对象

时间:2018-02-17 19:02:05

标签: html node.js cheerio

我想了解如何抓取网站数据。这是我感兴趣的html的一部分。我使用cheerio来查找我需要的数据。

<td class="col-item-shopdetail">
    <div class="shoprate2 text-right hidden-xs">
        <div class="currbox-amount">
            <span class="item-searchvalue-curr">SGD</span>
            <span class="item-searchvalue-rate text-black">42.0000</span>
        </div>
        <div class="item-inverserate">TWD 100 = SGD 4.2</div>
        <div class="rateinfo">
            <span class="item-timeframe">12 hours ago</span>
        </div>
    </div>
    <div class="shopdetail text-left">
        <div class="item-shop">Al-Aman Exchange</div>
        <div class="item-shoplocation">
            <span class="item-location1"><span class="icon icon-location3"></span>Bedok</span>
            <span class="item-location2"><span class="icon iconfa-train"></span>Bedok                            </span>
        </div>
    </div>
</td>

我希望制作&#34; col-item-shopdetail&#34; class作为一个对象并存储所有具有名称&#34; col-item-shopdetail&#34;的类。进入一个数组进行访问。

因此,如果可能的话,它将像array.item-inverserate一样访问或通过cheerio选择器访问

$('.col-item.shopdetail').children[0].children[0].children[1]

我尝试在数组中循环遍历商店和商店的名称,并在完成循环名称后使用另一个循环来查找费率。然后通过访问数组的相同索引尝试将速率与名称匹配。然而,由于每次打印的价格具有不同的价值且同一个名称的索引在每次尝试中都不同,因此不适用于未知原因。

这接近我想要的但是不起作用:

how to filter cheerio objects in `each` with selector?

1 个答案:

答案 0 :(得分:0)

换句话说,您想要一个表示具有类.col-item-shopdetail的元素的对象数组,并且每个对象都应该具有与它们包含的.item-inverserate元素对应的属性?

您需要map method

my_array = $('.col-item-shopdetail').map(function(i, el) {
    // Build an object having only one property being the .item-inverserate text content
    return {
       itemInverserate: $(el).find('.item-inverserate').text()
    }; 
}).get();

// You can also directly target inverserate nodes 
// which will exclude empty entries ('shopdetail' that have no 'inverserate')
// Loop over .item-inverserate elements found
// somewhere in a .col-item-shopdetail
// (beware, space matters)
my_array = $('.col-item-shopdetail .item-inverserate').map(function(i, el) {
    // Build an object having only one property being the .item-inverserate text content
    return {itemInverserate: $(el).text()};

    // Note: If all you need is the inverserate value,
    // Why not avoiding an intermediate full object?
    // return $(el).text()
}).get();

由于Cheerio开发人员已经使用大多数核心方法构建了基于jQuery的API,我们可以在浏览器中简单地测试片段...

my_array = $('.col-item-shopdetail').map(function(i, el) {
    return {
       itemInverserate: $(el).find('.item-inverserate').text()
    }; 
}).get();

console.log(my_array[0].itemInverserate)

my_array_2 = $('.col-item-shopdetail .item-inverserate').map(function(i, el) {
    // Build an object having only one property being the .item-inverserate text content
    return {itemInverserate: $(el).text()};
}).get();

console.log(my_array_2[0].itemInverserate)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<table><tr><td class="col-item-shopdetail">
    <div class="shoprate2 text-right hidden-xs">
        <div class="currbox-amount">
            <span class="item-searchvalue-curr">SGD</span>
            <span class="item-searchvalue-rate text-black">42.0000</span>
        </div>
        <div class="item-inverserate">TWD 100 = SGD 4.2</div>
        <div class="rateinfo">
            <span class="item-timeframe">12 hours ago</span>
        </div>
    </div>
    <div class="shopdetail text-left">
        <div class="item-shop">Al-Aman Exchange</div>
        <div class="item-shoplocation">
            <span class="item-location1"><span class="icon icon-location3"></span>Bedok</span>
            <span class="item-location2"><span class="icon iconfa-train"></span>Bedok                            </span>
        </div>
    </div>
</td></tr>
</table>