Javascript：Table 中的订单列表项目

Question

我正在 table.I 中使用 javascript 处理任务，我正在尝试添加订单列表，但卡在该代码中。单击按钮时，table 显示我有 achieve.but 它应该用数字显示的东西我需要添加订单列表 also.Please 任何可以帮助我解决的人 these.Taking from here, But my code is not working codepen。请有人指点我正确的方向。

输出：

提前致谢。

<html>
<head></head>
<body>
 <h3>JavaScript Programming</h3>
 <hr/>  
 <input type="button" onclick="f1()" value="Get Data"  />
 <br/>
 <br/>
 <table id="table1"  border="2"> 
 </table>
 
 <script> 
  function  f1() {
   var  ar = ["HTML5", "CSS3", "JavaScript", "Angular JS", "Node JS", "Express JS"];
      
   var  str  =  "";
   for(var i  in  ar)
   {
    str =  str  +   "<tr><td>" +  ar[i]  +  "  </td> </tr>";
   }
      
   var obj = document.getElementById("table1");
   obj.innerHTML  = str;
  } 
 </script>
</body>
</html>

Answer 1

您必须先将 listOfList 定义为数组

 const listOfList = []

第二次更改 element ar[i]

listOfList.push("<li>" + ar[i] + "</li>");

function f1() {
    const listOfList = [];
    const ar = ["HTML5", "CSS3", "JavaScript", "Angular JS", "Node JS", "Express JS"];
   

    let str = "";
    for (let i in ar) {
        str = str + "<tr><td>" + (+i+1)+ "."+ ar[i] + "  </td> </tr>";
        listOfList.push("<li>" + ar[i] + "</li>");
    }

    const obj = document.getElementById("table1");
    obj.innerHTML = str;

}

<html>
<head></head>
<body>
 <h3>JavaScript Programming</h3>
 <hr/>  
 <input type="button" onclick="f1()" value="Get Data"  />
 <br/>
 <br/>
 <table id="table1"  border="2"></table>
</body>
</html>

Javascript：Table 中的订单列表项目

Javascript: Orderlist items In Table

html

javascript

arrays

html-lists