如何从 Cheerio/jQuery 中的 li 元素中选择值？

问题描述

<div class="tabs__content tabs__content--bg js-tab-panel">
<div class="tabs__panel tabs__panel--active">
   <div class="product__sizes-wrapper">
      <ul class="product__sizes-select js-size-select-list" data-locale="UK">
         <li class="product__sizes-option" data-msg="Sample Message" data-name="6"  data-value="060">
            <span class="product__sizes-size">
            <span class="product__sizes-size-1">6</span>
            <span class="product__sizes-size-2"></span>
            </span>
         </li>
         <li class="product__sizes-option" data-msg="Sample Message" data-name="7"  data-value="070">
            <span class="product__sizes-size">
            <span class="product__sizes-size-1">7</span>
            <span class="product__sizes-size-2"></span>
            </span>
         </li>
         <li class="product__sizes-option" data-msg="Sample Message" data-name="8"  data-value="080">
            <span class="product__sizes-size">
            <span class="product__sizes-size-1">8</span>
            <span class="product__sizes-size-2"></span>
            </span>
         </li>
         <li class="product__sizes-option" data-msg="Sample Message" data-name="9.5"  data-value="095">
            <span class="product__sizes-size">
            <span class="product__sizes-size-1">9.5</span>
            <span class="product__sizes-size-2"></span>
            </span>
         </li>
      </ul>
   </div>
</div>

我想从 product__sizes-size-1 类中提取值并将它们转换为数组。我尝试使用 .map() 函数来尝试填充数组，但它显示为空。为了清楚起见，我希望将数组填充为 [6,7,8,9.5] 等...

const sizes = $(".product__sizes-wrapper [data-locale = 'UK']").map(function() {
                        return $(this).text();
                     }).get();

解决方法

您的方法是正确的，您只是使用了错误的选择器。改用 product__sizes-size-1：

$(document).ready(function(){
    var sizes = $('.product__sizes-size-1').map(function(){return $(this).text()}).get();
});

,

选择它 $('#product__sizes-select li.product__sizes-size-1');

数组中

var product_sizes = [];
$('ul').each(function() {
    var localproduct_sizes = [];
    $(this).find('li').each(function(){
        localproduct_sizes.push( $(this).attr('product__sizes-size-1') );
    });
    product_sizes.push(localproduct_sizes);
});