如何按类名获取正在更改的多个元素?

Question

谁能帮我？ 我正在尝试按类名选择多个元素。 一切都很好，直到页面中间的某个地方没有评论文本，只有评论者的姓名和已审查的产品。 如果该特定行不存在，如何将其设置为跳过元素并移动到下一行？

编辑： 因此，在提出建议后，我尝试使用以下代码，但控制台说-
forEach不是一个函数。我在以下页面上运行它： https://www.etsy.com/shop/FamilyshirtsCo/reviews

var productRows = document.getElementsByClassName("div.flag-body pb-xs-0");
productRows.forEach(function(productRow){
var name = productRow.querySelector(".p.shop2-review-attribution");
var comments = productRow.querySelector(".p.prose break-word m-xs-0");
var product = productRow.querySelector(".flag-body hide-xs hide-sm");
var final = product[i].innerText +" | "+ price[i].innerText +" | "+ 
quantity[i].innerText;
console.log(final);
});

Answer 1

getElementsByClassName 返回具有指定类的所有元素，而不考虑其同级或父级。 在这里，您可以将 some 类提供给行的父类：

因此，html结构将如下所示：

<div class="product-row">
<div class="product">
some product
</div>
<div class="price">
some price
</div>
<div class="quantity">
some quantity
</div>
</div>

Javascript ：

var productRows = document.getElementsByClassName("product-row");
productRows.forEach(function(productRow){
var product = productRow.querySelector(".product");
var price = productRow.querySelector(".price");
var quantity = productRow.querySelector(".quantity");
var order = product[i].innerText +" | "+ price[i].innerText +" | "+ quantity[i].innerText;
console.log(order);
});

我希望这将解决您的问题

Answer 2

必须是 for 循环而不是 forEach。它是 HTMLCollection 而不是简单的数组。

var productRows = document.getElementsByClassName("product-row");
for ( var x = 0; x < productRows.lenght; x++) {
var product = productRows[x].querySelector(".product");
var price = productRows[x].querySelector(".price");
var quantity = productRows[x].querySelector(".quantity");
var order = product[i].innerText + " | " +
price[i].innerText + " | " +
quantity[i].innerText;

console.log(order);
};

<div class="product-row">
<div class="product">
some product
</div>
<div class="price">
some price
</div>
<div class="quantity">
some quantity
</div>
</div>