我正在尝试在 html 中添加一个 for 循环，？ 但 for 循环显示错误

Question

I see a red squiggly line under { while add this for loop in my table, what am I missing here.

var cartHtml = `<table>
                  <tr>
                     <th> Item</th>
                     <th> Description</th>
                     <th> Price</th>
                     <th> Qty</th>
                     <th> Totall</th>
                  </tr>
                  <tr>`
                     ${for (var i=0; i<5; i++){
                       `<td>data</td>`
                     }}
                 `</tr>
                 </table>`

enter image description here

enter image description here

Answer 1

Instead of trying to do a for-loop directly in innerHTML you can make a function of the loop and save the return data you want in another variable:

let loopdata;

const loop = () => {
    for (let i = 0; i < 5; i++) {
     loopdata+=`<td>data</td>`;
    }
    return loopdata;
  };
  
  var cartHtml = `
   <table>
  <tr>
     <th> Item</th>
     <th> Description</th>
     <th> Price</th>
     <th> Qty</th>
     <th> Totall</th>
  </tr>
  <tr>
  ${loop()}
  </tr>
  </table>`;