[8/21] Испытание мороженым

Код
var updateCards = function (cards) {
  var items = document.querySelectorAll('.goods .good'); // коллекция из html-кода 
  for (var i = 0; i < items.length; i++) {
    var item = items[i]; // текущий элемент коллекции
    var good = cards[i]; // текущий элемент массива объектов
    var itemAvailability = 'good--available';
    var itemHit = 'good--hit';
    if (!good.inStock) {
      itemAvailability = 'good--unavailable';
    }
    item.classList.add(itemAvailability);
    
    if (good.isHit) {
      item.classList.add(itemHit);
    }
  }
};

updateCards(assortmentData);
2 лайка

Что ни так?)

Код

var updateCards = function(array){
var elements = document.querySelectorAll(’.good’);
for(var i = 0; i < array.length; i++){
var element = elements[i];
var product = array[i];

var inStockValue = 'good--available';
if(!product.inStock){
  inStockValue = 'good--unavailable';
  }
  
element.classList.add(inStockValue);  


if(product.isHit){
  element.classList.add('good--hit');
  }
}

};

updateCards(assortmentData);

i < elements.length;

спасибо, уф что-то я тут запутался немного, нужно пользоваться комметариями)

1 лайк

Сделал без дополнительной переменной - строки, ибо считаю что она нафиг не нужна. Плодить просто так переменные.

    var updateCards = function(assData) {
      var goods = document.querySelectorAll('li.good');
      for (var i=0; i<goods.length; i++) {
        var good = goods[i];
        if(assData[i].inStock) {
          good.classList.add('good--available');
        } else {
          good.classList.add('good--unavailable');
        }
        if(assData[i].isHit) { 
          good.classList.add('good--hit');
        }
      }
    }

    updateCards(assortmentData);
6 лайков

выполнил задание, но сделать через строковую переменную как в прошлом задании так и не получилось, почему-то программа работает в этом случае некорректно, долго сидел пытался понять в чём дело, но безрезультатно. И даже когда всё таки выполнил прям присвоением строки с названием класса и задача засчиталась, то в консоли всё равно появляется ошибка “Cannot read property ‘classList’ of undefined”. Не понимаю в чём проблема.

var updateCards = function(assortments) {
var icecreamObjects = document.querySelectorAll(’.good’);

for (var i=0; i<icecreamObjects.length; i++) {
var assortment = assortments[i];
if (assortment.inStock) {
var goodAvailability = ‘good–available’}
else {goodAvailability = ‘good–unavailable’
};

if (assortment.isHit) {
var goodHit = 'good--hit'};
  
var icecreamObject = icecreamObjects[i];

icecreamObject.classList.add(goodAvailability, goodHit);

};

}
updateCards(assortmentData);

Класс доступности товара добавляется только если он является хитом?

code
var updateCards = function(assort) {
  var goods = document.querySelectorAll('.good');
  
  for (i = 0; i < goods.length; i++) {
    if (assort[i].isHit) {
      goods[i].classList.add('good--hit');
    }
    if (assort[i].inStock) {
      goods[i].classList.add('good--available');
    } else {
      goods[i].classList.add('good--unavailable');
    }
  }
}

updateCards(assortmentData);

мне кажется нет смысла добавлять класс available даже в CSS, по логике товар либо есть сам по себе либо unavailable, по этому я вообще исключил это условие у себя в задаче

1 лайк
Summary
var updateCards = function (assortmentData) {
  var elements = document.querySelectorAll('.good');
  for (var i = 0; i < elements.length; i++) {
    elements[i].classList.add(assortmentData[i].inStock ? 'good--available' : 'good--unavailable');
    assortmentData[i].isHit ? elements[i].classList.add('good--hit') : null;
  };
};
updateCards(assortmentData);

мое решение

код

var products = document.querySelectorAll(‘li’)
var assortmentData = [
{
inStock: true,
isHit: false
},
{
inStock: false,
isHit: false
},
{
inStock: true,
isHit: true
},
{
inStock: true,
isHit: false
},
{
inStock: false,
isHit: false
}
];

var updateCards = function(massiv) {
for (var i=0; i< massiv.length-1 ; i++) {
var prod = products[i];

 if (massiv[i].inStock ) {
   prod.classList.add('good--available');
   } 
   else {
     prod.classList.add('good--unavailable');
     }
     if(massiv[i].isHit) {
      prod.classList.add('good--hit');
       }  

}

}

updateCards(assortmentData);

Моё решение

Код
var updateCards = function(array) {
  var iceCream = document.querySelectorAll('.good');
  for(var i = 0; i < iceCream.length; i++) {
    var ice = iceCream[i];
    var ice2 = array[i];
    var iceAvaibility = 'good--available';
    
    if (!ice2.inStock) {
      iceAvaibility = 'good--unavailable';
    }
    
    ice.classList.add(iceAvaibility);
    
    if (ice2.isHit) {
      ice.classList.add('good--hit');
    }
  }
};

updateCards(assortmentData);

Откуда функция узнает что сбстна есть переменная products?

Почему во время работы вылетает ошибка? (я проверил 2 кода, у обоих такое было)
TypeError: Cannot read property ‘classList’ of undefined

какой браузер? скорей всего проблема в нем, попробуйте в другом

Добрый день! Почему не отображается “В наличии” ???

    var assortmentData = [
  {
    inStock: true,
    isHit: false
  },
  {
    inStock: false,
    isHit: false
  },
  {
    inStock: true,
    isHit: true
  },
  {
    inStock: true,
    isHit: false
  },
  {
    inStock: false,
    isHit: false
  }
];

var updateCards = function (cards) {
  var elements = document.querySelectorAll('.good');
  
  for (var i = 0; i < cards.length; i++) {
    var element = elements[i];
    var card = cards[i];
    var availabilityClass = 'good--unavailable';
        
    if (card.inStock) {
      availabilityClass = 'good--available';
    };
    
    element.classList.add('availabilityClass');
  }
}    
  updateCards(assortmentData);

Не дублируйте вопросы, пожалуйста. Удалите копию.

помогите плс, никак не мог найти ошибку ( пишет вот это " TypeError: undefined is not an object (evaluating ‘good.classList.add’) "

var assortmentData = [
{
inStock: true,
isHit: false
},
{
inStock: false,
isHit: false
},
{
inStock: true,
isHit: true
},
{
inStock: true,
isHit: false
},
{
inStock: false,
isHit: false
}
];

var updateCards = function(goodSale){
var good = document.querySelectorAll('.good');
for (var i = 0; i < good.length; ++i){
    if (goodSale[i].inStock === true){ 
        good.classList.add('good--available');
    } else {
        good.classList.add('good--unavailable');
    }
    if (goodSale[i].isHit === true){
        good.classList.add('good--hit')
    }
}
}; 

updateCards(assortmentData);

Ты выбираешь узлы методом querySelectorAll, который дает на выходе псевдомассив объектов, и потом пытаешься псевдомассиву добавить класс. Добавляй класс конкретному объекту. Объектом является good[1], например.

1 лайк

Так все же дополнительные переменные нужны для текущих элементов, или они не обязательны
и можно записывать что-то вроде: if(cards[i].inStock) ???