Cheerio NPM，需要一种安全的方式来帮助分组和分隔具有相同 class/id/attribute 的项目

Question

对于这个 npm，我正在寻找一种简单的方法来将我为一个元素获得的所有值推送到一个数组中。例如，到目前为止我这样做：

let names = $(".productname") 
let arr = []
arr.push(names.text())

但这实际上并不是按照索引形式拼接元素，而是将它们组合成一个。我如何通过将它们从“$”获取到数组的方式相应地分开它们，这样：

arr[0] = value1
arr[1] = value2

而不是：

arr[0] = value1 value2 (concatenated)

我的代码：

function find(response){
const $ = cheerio.load(response)
let names = $(".productname")
let namesArr = []
$.each(names, function(k, v) {
    namesArr.push($(v).text());
});
console.log(namesArr)
}

}

页面来源：https://hastebin.com/ayeqodufog.xml

Answer 1

由于您的选择器包含带有 class "productname" 的所有元素，您需要遍历该集合以将每个元素的文本推送到数组中。

下面，我用了jQuery的each()。

let names = $(".productname");
let arr = [];

$.each(names, function(k, v) {
  arr.push($(v).text());
});

console.log(arr);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="productname">Test 1</div>
<div class="productname">Test 2</div>
<div class="productname">Test 3</div>

或者，您可以尝试 map():

let names = $(".productname");

let arr = $.map(names, function(v) {
  return $(v).text();
});

console.log(arr);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="productname">Test 1</div>
<div class="productname">Test 2</div>
<div class="productname">Test 3</div>

实际样本 HTML:

let names = $(".productname");

let arr = $.map(names, function(v) {
  return $(v).text();
});

console.log(arr);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="row">
  <div class="twelve columns">
    <ul class="block-grid four-up mobile-two-up productlist">

      <li class="item">
        <div class="itemWrapper pOverlay">
          <div class="pImageContainer">
            <a class="plink image" href="/en/p/jordan-air-jordan-3-retro-se-q54-at9195-001-92166">
              <div class="pLabel comingsoon"><span>Coming soon</span></div>
              <div data-picture data-alt="Jordan - AIR JORDAN 3 RETRO SE Q54" jail="true">

                <div data-src="/files/image/id/66689/fixed/1/w/150/h/150/n/jordan-air-jordan-3-retro-se-q54-at9195-001-1.jpg"></div>
                <div data-src="/files/image/id/66689/fixed/1/w/400/h/400/n/jordan-air-jordan-3-retro-se-q54-at9195-001-1.jpg" data-media="(min-width: 400px)"></div>
                <div data-src="/files/image/id/66689/fixed/1/w/300/h/300/n/jordan-air-jordan-3-retro-se-q54-at9195-001-1.jpg" data-media="(min-width: 800px)"></div>

                <noscript>
                          <img src="/files/image/id/66689/fixed/1/w/400/h/400/n/jordan-air-jordan-3-retro-se-q54-at9195-001-1.jpg" alt="Jordan - AIR JORDAN 3 RETRO SE Q54">
                        </noscript>
              </div>
              <img src="/files/image/id/white/fixed/1/w/400/h/400/n/white.jpg" id="" class="" alt="Jordan - AIR JORDAN 3 RETRO SE Q54" />
              <div class="pImageLoader" style="display:none;">
                <div class="spinner small"></div>
              </div>
            </a>
          </div>
          <div class="pText">
            <a class="pName" title="Jordan - AIR JORDAN 3 RETRO SE Q54" href="/en/p/jordan-air-jordan-3-retro-se-q54-at9195-001-92166">
              <span class="producername">Jordan</span>
              <span class="productname">AIR JORDAN 3 RETRO SE Q54</span>
            </a>
            <span class="price">
                      €179.99                    </span>
            <div class="pAdditions">
              <hr />
              <div class="variantSelectorGroup">
                <span class="reminderHeadline">Notify me</span>
                <ul class="variantSelector">
                  <li class="variantTitle">Size</li>
                  <li><a class="variantSelectorSelect active" displaygroup="EU">EU</a></li>
                  <li><a class="variantSelectorSelect " displaygroup="US">US</a></li>
                </ul>
                <ul class="availableVariants">
                  <li class="soldout" title="Notify me">
                    <a href="/en/p/jordan-air-jordan-3-retro-se-q54-at9195-001-92166-92167" EU='40' US='7'>40</a>
                    <li class="soldout" title="Notify me">
                      <a href="/en/p/jordan-air-jordan-3-retro-se-q54-at9195-001-92166-92168" EU='40,5' US='7,5'>40,5</a>
                      <li class="soldout" title="Notify me">
                        <a href="/en/p/jordan-air-jordan-3-retro-se-q54-at9195-001-92166-92169" EU='41' US='8'>41</a>
                        <li class="soldout" title="Notify me">
                          <a href="/en/p/jordan-air-jordan-3-retro-se-q54-at9195-001-92166-92170" EU='42' US='8,5'>42</a>
                          <li class="soldout" title="Notify me">
                            <a href="/en/p/jordan-air-jordan-3-retro-se-q54-at9195-001-92166-92171" EU='42,5' US='9'>42,5</a>
                            <li class="soldout" title="Notify me">
                              <a href="/en/p/jordan-air-jordan-3-retro-se-q54-at9195-001-92166-92172" EU='43' US='9,5'>43</a>
                              <li class="soldout" title="Notify me">
                                <a href="/en/p/jordan-air-jordan-3-retro-se-q54-at9195-001-92166-92173" EU='44' US='10'>44</a>
                                <li class="soldout" title="Notify me">
                                  <a href="/en/p/jordan-air-jordan-3-retro-se-q54-at9195-001-92166-92174" EU='44,5' US='10,5'>44,5</a>
                                  <li class="soldout" title="Notify me">
                                    <a href="/en/p/jordan-air-jordan-3-retro-se-q54-at9195-001-92166-92175" EU='45' US='11'>45</a>
                                    <li class="soldout" title="Notify me">
                                      <a href="/en/p/jordan-air-jordan-3-retro-se-q54-at9195-001-92166-92176" EU='45,5' US='11,5'>45,5</a>
                                      <li class="soldout" title="Notify me">
                                        <a href="/en/p/jordan-air-jordan-3-retro-se-q54-at9195-001-92166-92177" EU='46' US='12'>46</a>
                                        <li class="soldout" title="Notify me">
                                          <a href="/en/p/jordan-air-jordan-3-retro-se-q54-at9195-001-92166-92178" EU='47' US='12,5'>47</a>
                                          <li class="soldout" title="Notify me">
                                            <a href="/en/p/jordan-air-jordan-3-retro-se-q54-at9195-001-92166-92179" DEFAULT='US 13'></a>
                                            <li class="soldout" title="Notify me">
                                              <a href="/en/p/jordan-air-jordan-3-retro-se-q54-at9195-001-92166-92180" EU='48,5' US='14'>48,5</a>
                                              <li class="soldout" title="Notify me">
                                                <a href="/en/p/jordan-air-jordan-3-retro-se-q54-at9195-001-92166-92181" EU='49,5' US='15'>49,5</a>
                </ul>
              </div>
              <div class="shippingInfo">
                Free shipping to United Kingdom </div>
            </div>

          </div>
        </div>
        </li>
        <li class="item">
          <div class="itemWrapper pOverlay">
            <div class="pImageContainer">
              <a class="plink image" href="/en/p/nike-air-max-1-ar1249-001-71499">
                <div data-picture data-alt="Nike - AIR MAX 1" jail="true">

                  <div data-src="/files/image/id/66793/fixed/1/w/150/h/150/n/nike-air-max-1-ar1249-001-1.jpg"></div>
                  <div data-src="/files/image/id/66793/fixed/1/w/400/h/400/n/nike-air-max-1-ar1249-001-1.jpg" data-media="(min-width: 400px)"></div>
                  <div data-src="/files/image/id/66793/fixed/1/w/300/h/300/n/nike-air-max-1-ar1249-001-1.jpg" data-media="(min-width: 800px)"></div>

                  <noscript>
                          <img src="/files/image/id/66793/fixed/1/w/400/h/400/n/nike-air-max-1-ar1249-001-1.jpg" alt="Nike - AIR MAX 1">
                        </noscript>
                </div>
                <img src="/files/image/id/white/fixed/1/w/400/h/400/n/white.jpg" id="" class="" alt="Nike - AIR MAX 1" />
                <div class="pImageLoader" style="display:none;">
                  <div class="spinner small"></div>
                </div>
              </a>
            </div>
            <div class="pText">
              <a class="pName" title="Nike - AIR MAX 1" href="/en/p/nike-air-max-1-ar1249-001-71499">
                <span class="producername">Nike</span>
                <span class="productname">AIR MAX 1</span>
              </a>
              <span class="price">
                      €149.99                    </span>
              <div class="pAdditions">
                <hr />
                <div class="variantSelectorGroup">
                  <ul class="variantSelector">
                    <li class="variantTitle">Size</li>
                    <li><a class="variantSelectorSelect active" displaygroup="EU">EU</a></li>
                    <li><a class="variantSelectorSelect " displaygroup="US">US</a></li>
                  </ul>
                  <ul class="availableVariants">
                    <li title="">
                      <a href="/en/p/nike-air-max-1-ar1249-001-71499-71500" EU='41' US='8'>41</a>
                      <li title="">
                        <a href="/en/p/nike-air-max-1-ar1249-001-71499-71501" EU='42' US='8,5'>42</a>
                        <li title="">
                          <a href="/en/p/nike-air-max-1-ar1249-001-71499-71502" EU='42,5' US='9'>42,5</a>
                          <li title="">
                            <a href="/en/p/nike-air-max-1-ar1249-001-71499-71503" EU='43' US='9,5'>43</a>
                            <li title="">
                              <a href="/en/p/nike-air-max-1-ar1249-001-71499-71504" EU='44' US='10'>44</a>
                              <li title="">
                                <a href="/en/p/nike-air-max-1-ar1249-001-71499-71505" EU='44,5' US='10,5'>44,5</a>
                                <li title="">
                                  <a href="/en/p/nike-air-max-1-ar1249-001-71499-71506" EU='45' US='11'>45</a>
                                  <li title="">
                                    <a href="/en/p/nike-air-max-1-ar1249-001-71499-71507" EU='45,5' US='11,5'>45,5</a>
                                    <li title="">
                                      <a href="/en/p/nike-air-max-1-ar1249-001-71499-71508" EU='46' US='12'>46</a>
                  </ul>
                </div>
                <div class="shippingInfo">
                  Free shipping from €170.00 to United Kingdom </div>
              </div>

            </div>
          </div>
          </li>
          <li class="item">
            <div class="itemWrapper pOverlay">
              <div class="pImageContainer">
                <a class="plink image" href="/en/p/nike-air-max-90-premium-se-858954-600-73728">
                  <div data-picture data-alt="Nike - Air Max 90 Premium SE" jail="true">

                    <div data-src="/files/image/id/66790/fixed/1/w/150/h/150/n/nike-air-max-90-premium-se-858954-600-1.jpg"></div>
                    <div data-src="/files/image/id/66790/fixed/1/w/400/h/400/n/nike-air-max-90-premium-se-858954-600-1.jpg" data-media="(min-width: 400px)"></div>
                    <div data-src="/files/image/id/66790/fixed/1/w/300/h/300/n/nike-air-max-90-premium-se-858954-600-1.jpg" data-media="(min-width: 800px)"></div>

                    <noscript>
                          <img src="/files/image/id/66790/fixed/1/w/400/h/400/n/nike-air-max-90-premium-se-858954-600-1.jpg" alt="Nike - Air Max 90 Premium SE">
                        </noscript>
                  </div>
                  <img src="/files/image/id/white/fixed/1/w/400/h/400/n/white.jpg" id="" class="" alt="Nike - Air Max 90 Premium SE" />
                  <div class="pImageLoader" style="display:none;">
                    <div class="spinner small"></div>
                  </div>
                </a>
              </div>
              <div class="pText">
                <a class="pName" title="Nike - Air Max 90 Premium SE" href="/en/p/nike-air-max-90-premium-se-858954-600-73728">
                  <span class="producername">Nike</span>
                  <span class="productname">Air Max 90 Premium SE</span>
                </a>
                <span class="price">
                      €144.99                    </span>
                <div class="pAdditions">
                  <hr />
                  <div class="variantSelectorGroup">
                    <ul class="variantSelector">
                      <li class="variantTitle">Size</li>
                      <li><a class="variantSelectorSelect active" displaygroup="EU">EU</a></li>
                      <li><a class="variantSelectorSelect " displaygroup="US">US</a></li>
                    </ul>
                    <ul class="availableVariants">
                      <li title="">
                        <a href="/en/p/nike-air-max-90-premium-se-858954-600-73728-73729" EU='41' US='8'>41</a>
                        <li title="">
                          <a href="/en/p/nike-air-max-90-premium-se-858954-600-73728-73730" EU='42' US='8,5'>42</a>
                          <li title="">
                            <a href="/en/p/nike-air-max-90-premium-se-858954-600-73728-73731" EU='42,5' US='9'>42,5</a>
                            <li title="">
                              <a href="/en/p/nike-air-max-90-premium-se-858954-600-73728-73732" EU='43' US='9,5'>43</a>
                              <li title="">
                                <a href="/en/p/nike-air-max-90-premium-se-858954-600-73728-73733" EU='44' US='10'>44</a>
                                <li title="">
                                  <a href="/en/p/nike-air-max-90-premium-se-858954-600-73728-73734" EU='44,5' US='10,5'>44,5</a>
                                  <li title="">
                                    <a href="/en/p/nike-air-max-90-premium-se-858954-600-73728-73735" EU='45' US='11'>45</a>
                                    <li class="soldout" title="Notify me">
                                      <a href="/en/p/nike-air-max-90-premium-se-858954-600-73728-73736" EU='45,5' US='11,5'>45,5</a>
                                      <li title="">
                                        <a href="/en/p/nike-air-max-90-premium-se-858954-600-73728-73737" EU='46' US='12'>46</a>
                    </ul>
                  </div>
                  <div class="shippingInfo">
                    Free shipping from €170.00 to United Kingdom </div>
                </div>

              </div>
            </div>
            </li>
    </ul>
  </div>
</div>
<!-- <PRODUCTLIST CATEGORY> END -->

Answer 2

使用 map() 和 get():

let arr = $(".productname").map((i, el) => $(el).text()).get()

使用each()

let arr = []
$(".productname").each((i, el) => arr.push($(el).text()))

你觉得哪个好看，我都喜欢。

Cheerio NPM，需要一种安全的方式来帮助分组和分隔具有相同 class/id/attribute 的项目

Cheerio NPM, need a secure way that helps group and separate items with same class/id/attribute

jquery

node.js

cheerio