Как внутри innerHTML вставить код javascript цикла?

Question

Добрый день есть такой код

homeItem.innerHTML = `
    <div class="home-item__top">
      <div class="home-item__price">${priceItem} Р</div>
      <div class="home-item__logo">
        <img src="https://${carrierURL}" alt="">
      </div>
    </div>
    <div class="home-item__points">
      // Начало foreach
      <div class="home-point">
        <ul>
          <li><span>MOW – HKT</span><span>10:45 – 08:00</span>
          </li>
          <li><span>В пути</span><span>21ч 15м</span>
          </li>
          <li><span>1 пересадка</span><span>HKG</span>
          </li>
        </ul>
      </div>
      // Конец foreach
    </div>
  `;

Answer 1

`
<div class="home-item__points">
  ${arr.map((item) => `
  // Начало foreach
  <div class="home-point">
    <ul>
      <li><span>MOW – HKT</span><span>10:45 – 08:00</span>
      </li>
      <li><span>В пути</span><span>21ч 15м</span>
      </li>
      <li><span>1 пересадка</span><span>HKG</span>
      </li>
    </ul>
  </div>
  // Конец foreach
  `).join('')}
</div>
`

Answer 2

var priceItem = 1000;
var carrierURL = "aaa.png";
var items = ["Text 1", "Text 2", "Text 3"];
var innerHTML = `
    <div class="home-item__top">
      <div class="home-item__price">${priceItem} Р</div>
      <div class="home-item__logo">
        <img src="https://${carrierURL}" alt="">
      </div>
    </div>
    <div class="home-item__points">
      // Начало foreach
      ${items.reduce((r,i) => `${r}<div>${i}</div>`, "")}
      // Конец foreach
    </div>
  `;
console.log(innerHTML);

БЛОГ НА HUSL

Как внутри innerHTML вставить код javascript цикла?

Ответы (2 шт):