javascript - 使用纯 javascript 从具有相同类的所有 div 获取值

Question

我需要获取 div 中具有相同类别的所有产品的 ID。我的代码只给我第一个产品的 ID。

这是html代码

<td>
    <div class="b-sku">SKU: 123456</div>
</td>
<td>
    <div class="b-sku">SKU: 33333</div>
</td>

我创建这个 javascript 代码只是为了获取值

function (){
    var out0 = document.querySelector('.b-sku').textContent;
    var out1 = out0.replace(/SKU:/g, "");
    var out2 = out1.replace(/\s/g, '');
    return out2;
}

但这段代码只返回 123456 而不是 33333 我想以逗号分隔格式获取两个 id，如

['123456', '33333']

请指教。

Answer 1

querySelectorAll

不使用 querySelector，而是使用 querySelectorAll 来获取要解析的元素的 NodeList。

function getBSKU() {
  var bSku = document.querySelectorAll('.b-sku');
  return Array.prototype.map.call(bSku, function(node) {
    var out1 = node.textContent.replace(/SKU:/g, "");
    var out2 = out1.replace(/\s/g, '');
    return out2;
  });
}

console.log(getBSKU())

<td>
  <div class="b-sku">SKU: 123456</div>
</td>
<td>
  <div class="b-sku">SKU: 33333</div>
</td>

现在您使用给定的 Array 对元素进行排序