23/23 Мороженое. Возвращение

Не проходит проверку, хотя визуально все совпадает. Помогите, пожалуйста, найти что не так)

var cardsData = [
  {
    inStock: true,
    imgUrl: 'gllacy/choco.jpg',
    text: 'Сливочно-кофейное с кусочками шоколада',
    price: 310,
    isHit: true,
    specialOffer: 'Двойная порция сиропа бесплатно!'
  },
  {
    inStock: false,
    imgUrl: 'gllacy/lemon.jpg',
    text: 'Сливочно-лимонное с карамельной присыпкой',
    price: 125,
    isHit: false
  },
  {
    inStock: true,
    imgUrl: 'gllacy/cowberry.jpg',
    text: 'Сливочное с брусничным джемом',
    price: 170,
    isHit: false
  },
  {
    inStock: true,
    imgUrl: 'gllacy/cookie.jpg',
    text: 'Сливочное с кусочками печенья',
    price: 250,
    isHit: false
  },
  {
    inStock: true,
    imgUrl: 'gllacy/creme-brulee.jpg',
    text: 'Сливочное крем-брюле',
    price: 190,
    isHit: false
  }
];


var createElements = function (tagName, className, text) {
  var element = document.createElement(tagName);
  element.classList.add(className);
  
  if (text) {
    element.contentText = text;
  }  
  return element;
};

var createCards = function (good) {
  var listItem = createElements('li', 'good');
  
  var titleItem = createElements('h2', 'good__description', good.text);
  
  var imgItem = createElements('img', 'good__image');
  
  var textItem = createElements('p', 'good__price', good.price);
  
  var vailable = 'good--available';
  if (!good.inStock) {
    vailable = 'good--unavailable';
  }
  listItem.classList.add(vailable);
  
  if (good.isHit) {
    listItem.classList.add('good--hit');
    var specialOffer = document.createElement('p');
    if (good.specialOffer) {
      specialOffer.classList.add('good__special-offer');
      specialOffer.textContent = good.specialOffer;
      }
    listItem.appendChild(specialOffer);
  }
  
  
  
  titleItem.textContent = good.text;
  listItem.appendChild(titleItem);
  
  
  imgItem.src = good.imgUrl;
  imgItem.alt = good.text;
  listItem.appendChild(imgItem);
  
  
  textItem.textContent = good.price + '₽/кг';
  listItem.appendChild(textItem);
    
  return listItem;  
}

var cardList = document.querySelector('.goods');
var cardListSpecial = document.querySelector('.good__special-offer');

for (var i = 0; i < cardsData.length; i++) {
  var cardItem = createCards(cardsData[i]);
  cardList.appendChild(cardItem);
  
}
1 лайк

У вас добавляется безусловно пустой абзац для спецпредложения в хитовые карточки (доберусь до компа, мож что поумнее выдавлю)

оказалось, что абзац добавлялся в начало элемента, а надо было в конец.
задача решена)

но вы все равно поправьте прикрепление по условию. вдруг кто забудет прописать спецпредложение хитовому товару

не понимаю почему проверку не проходит…сначала сам писал код, потом переписал просмотрев видео…всё равно не проходит…подскажите в чём проблема? Визуально всё идентично.

var cardsData = [
  {
    inStock: true,
    imgUrl: 'gllacy/choco.jpg',
    text: 'Сливочно-кофейное с кусочками шоколада',
    price: 310,
    isHit: true,
    specialOffer: 'Двойная порция сиропа бесплатно!'
  },
  {
    inStock: false,
    imgUrl: 'gllacy/lemon.jpg',
    text: 'Сливочно-лимонное с карамельной присыпкой',
    price: 125,
    isHit: false
  },
  {
    inStock: true,
    imgUrl: 'gllacy/cowberry.jpg',
    text: 'Сливочное с брусничным джемом',
    price: 170,
    isHit: false
  },
  {
    inStock: true,
    imgUrl: 'gllacy/cookie.jpg',
    text: 'Сливочное с кусочками печенья',
    price: 250,
    isHit: false
  },
  {
    inStock: true,
    imgUrl: 'gllacy/creme-brulee.jpg',
    text: 'Сливочное крем-брюле',
    price: 190,
    isHit: false
  }
];
var makeElement = function (tagName, className, text) {
  var element = document.createElement(tagName);
  element.classList.add(className);
  if (text) {
    element.textContent = text;
  }
  return element;
};

var createCard = function (good){
  var listItem = makeElement('li', 'good');
  
  var availabilityClass = 'good--available';
  if (!good.inStock){
    availabilityClass = 'good--unavailable'}
  listItem.classList.add(availabilityClass);
  
  var title = makeElement('h1', 'good__description', good.text);
  listItem.appendChild(title);
  
  var picture = makeElement('img', 'good__image');
  picture.src = good.imgUrl;
  picture.alt = good.text;
  listItem.appendChild(picture);
  
  var price = makeElement('p', 'good__price', good.price + '₽/кг');
  listItem.appendChild(price);
  
  if (good.isHit){
    listItem.classList.add('good--hit');
    var specialOffer = makeElement('p', 'good__special-offer', good.specialOffer);
    listItem.appendChild(specialOffer)};
  
  return listItem
  }

var renderCards = function (goods){
  var cardList = document.querySelector('.goods');
  for (var i = 0; i < goods.length; i++){
  
  var cardItem = createCard(goods[i]);
  cardList.appendChild(cardItem);
  }
  };
  
renderCards(cardsData)

заголовок товара должен быть h2.
запомните, что h1 на странице должен быть только один и чаще всего это название статьи, название магазина и т.п.
тем более, что это в ТЗ прописано
image

понял, спасибо

Не работает проверка
var makeElement=function(tagName, className, text) {
var element=document.createElement(tagName);
element.classList.add(className);
if(text) {
element.textContent=text;
}
return element;
}

var createCard=function(good) {
var listItem=makeElement(‘li’,‘good’);

var availabilityClass=‘good–available’;
if (!good.inStock) {
availabilityClass=‘good–unavailable’;
}

listItem.classList.add(availabilityClass);

var title=makeElement(‘h2’,‘good_description’,good.text);
listItem.appendChild(title);

var picture=makeElement(‘img’,‘good_image’);
picture.src=good.imgUrl;
picture.alt=good.text;
listItem.appendChild(picture)

var price=makeElement(‘p’,‘good__price’,good.price+‘₽/кг’);
listItem.appendChild(price);

if(good.isHit) {
listItem.classList.add(‘good–hit’);
var specialOffer=makeElement(‘p’,‘good__special-offer’, good.specialOffer);
listItem.appendChild(specialOffer);
}
return listItem;
}

var renderCards=function(goods) {
var cardList=document.querySelector(’.goods’);

for (var i=0;i<goods.length;i++) {
var cardItem=createCard(goods[i]);
cardList.appendChild(cardItem);
}

};

renderCards(cardsData)

а пока могу сказать что классы не соответствуют тз

Как его добавить в конец, если он у вас и так в конце?

Почему тест не пройден при 100% совпадении?!

var cardsData = [
{
inStock: true,
imgUrl: ‘gllacy/choco.jpg’,
text: ‘Сливочно-кофейное с кусочками шоколада’,
price: 310,
isHit: true,
specialOffer: ‘Двойная порция сиропа бесплатно!’
},
{
inStock: false,
imgUrl: ‘gllacy/lemon.jpg’,
text: ‘Сливочно-лимонное с карамельной присыпкой’,
price: 125,
isHit: false
},
{
inStock: true,
imgUrl: ‘gllacy/cowberry.jpg’,
text: ‘Сливочное с брусничным джемом’,
price: 170,
isHit: false
},
{
inStock: true,
imgUrl: ‘gllacy/cookie.jpg’,
text: ‘Сливочное с кусочками печенья’,
price: 250,
isHit: false
},
{
inStock: true,
imgUrl: ‘gllacy/creme-brulee.jpg’,
text: ‘Сливочное крем-брюле’,
price: 190,
isHit: false
}
];

var makeElement = function (tagName, className, text) {
var element = document.createElement(tagName);
element.classList.add(className);
if (text) {
element.textContent = text;
}

return element;

}

var createCard = function (product) {
var listItem = makeElement(‘li’, ‘good’);

var title = makeElement('h2', 'good__description', product.text);
listItem.appendChild(title);

var picture = makeElement('img', 'good__image', product.text);
picture.src = product.imgUrl;
picture.alt = product.text;
listItem.appendChild(picture);

var price = makeElement('p', 'good__price', product.price + '₽/кг');
listItem.appendChild(price);

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

if (product.isHit) {
    var hitClass = 'good--hit';
    listItem.classList.add(hitClass);
    var specialOffer = makeElement('p', 'good__special-offer', product.specialOffer);
    listItem.appendChild(specialOffer);
  }

return listItem;

}

var cardList = document.querySelector(’.goods’);

for (var i = 0; i < cardsData.length; i++) {
var cardItem = createCard(cardsData[i]);
cardList.appendChild(cardItem);
}