Как получить несколько элементов по имени класса, которые меняются? - PullRequest
Новая
       20

Как получить несколько элементов по имени класса, которые меняются?

0 голосов
/ 14 февраля 2020

Кто-нибудь может мне помочь? Я пытаюсь выбрать несколько элементов по имени класса. Все хорошо, пока где-то в середине страницы комментарии текст недоступен, только имя рецензента и продукт, который был рассмотрен. Как настроить его, чтобы пропустить элемент и перейти к следующей строке, если ее нет для этой конкретной строки?

отредактировано: Итак, после предложений я попытался использовать приведенный ниже код, но консоль говорит
- 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);
});

Ответы [ 2 ]

1 голос
/ 14 февраля 2020

getElementsByClassName возвращает все элементы, имеющие указанный класс, независимо от его братьев и сестер или родителя. Здесь вы можете присвоить некоторый класс родительскому классу строки:

Таким образом, структура 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);
});

Я надеюсь, что это решит вашу проблему

0 голосов
/ 14 февраля 2020

Должно быть для l oop не для каждого. Это 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>
...