Javascript 用数组中的对象制作表格？

我是javascript的初学者，我的代码有点问题。我找到了一个练习，我正试着去做。我必须编写一个函数，将变量中的文本插入表中。我从没见过这样的事。此变量看起来像数组中的四个对象。我想在按下按钮时在表格中显示文本。有两个按钮。当我按下“Fizyka”按钮时，我会看到：

• Fizyka
• 奥拉科瓦尔
• 埃拉诺瓦克

当我按“Chemia”时：

• Chemia
• 阿拉戈拉尔
• 乌拉·斯帕克

这是我的代码。我只能编辑功能显示（研究）：

菲兹卡
舍米亚
var学生=[
{名称：“Ola”，第二个名称：“Kowal”，研究：“fizyka”}，
{名称：“Ela”，第二个名称：“Nowak”，研究：“fizyka”}，
{名称：“Ala”，第二个名称：“Goral”，研究：“chemia”}，
{名称：“Ula”，第二个名称：“Szpak”，研究：“chemia”}，
];  
功能展示（研究）
{
如果（研究=='fizyka'）
{
document.getElementById（“list”）.innerHTML=“student.kierunek
student.name+”“+student.second\u name
student.name+”“+student.second\u name
”；
}
如果（研究=='chemia'）
{
document.getElementById（“list”）.innerHTML=“student.kierunek
student.name+”“+student.second\u name
student.name+”“+student.second\u name
”；
}
}

---

它不起作用了我不知道如何将此变量中的文本插入表中。

您的代码有几个问题。我已经写了一段代码，它正在工作，你们可以使用它并激发灵感

<button onclick="show('fizyka')">Fizyka</button> 
<button onclick="show('chemia')">Chemia</button>
<div id="list"><h2></h2><ul></ul></div>


<script>
    //Student array
    var student=[
        {name:"Ola", second_name:"Kowal", study:"fizyka"},
        {name:"Ela", second_name:"Nowak", study:"fizyka"},
        {name:"Ala", second_name:"Goral", study:"chemia"},
        {name:"Ula", second_name:"Szpak", study:"chemia"},
                ];  

    function show(study)
    {
      console.log('ENTER show('+study+')');
      //Select h2 element 
      var header = document.getElementById("list").firstChild;
      //Set h2 element text
      header.innerHTML = study;

      //Select ul element
      var list = document.getElementById("list").lastChild;
      //Set inner html to empty string to clear the content
      list.innerHTML = "";
      //loop through students and set the appropriate html element values
      for(var i = 0; i < student.length; i++){
        //check whether student[i] studies study which is put as a paramter into the function
        if(student[i].study === study){
          //Create new li element
          var li = document.createElement('li');
          //Into li element add a new text node which contains all data about the student
          li.appendChild(document.createTextNode(student[i].name + ' ' + student[i].second_name));
          //add li element into ul
          list.appendChild(li); 
        }
      }
      console.log('LEAVE show('+study+')');

    }

</script>

菲兹卡 舍米亚

//学生数组 var学生=[ {名称：“Ola”，第二个名称：“Kowal”，研究：“fizyka”}， {名称：“Ela”，第二个名称：“Nowak”，研究：“fizyka”}， {名称：“Ala”，第二个名称：“Goral”，研究：“chemia”}， {名称：“Ula”，第二个名称：“Szpak”，研究：“chemia”}， ]; 功能展示（研究） { log（'输入show（'+study+'））； //选择h2元素 var header=document.getElementById（“列表”）.firstChild； //设置h2元素文本 header.innerHTML=研究； //选择ul元素 var list=document.getElementById（“list”）.lastChild； //将内部html设置为空字符串以清除内容 list.innerHTML=“”； //遍历学生并设置适当的html元素值 对于（变量i=0；i有更简单的方法吗？我是初学者，我不懂这段代码。你不懂哪部分？如果你愿意，我可以更好地注释我的代码。如果你想动态显示学生姓名，那么我认为这是最简单的方法之一。所以现在可能更清楚了

<button onclick="show('fizyka')">Fizyka</button> 
<button onclick="show('chemia')">Chemia</button>
<div id="list"><h2></h2><ul></ul></div>


<script>
    //Student array
    var student=[
        {name:"Ola", second_name:"Kowal", study:"fizyka"},
        {name:"Ela", second_name:"Nowak", study:"fizyka"},
        {name:"Ala", second_name:"Goral", study:"chemia"},
        {name:"Ula", second_name:"Szpak", study:"chemia"},
                ];  

    function show(study)
    {
      console.log('ENTER show('+study+')');
      //Select h2 element 
      var header = document.getElementById("list").firstChild;
      //Set h2 element text
      header.innerHTML = study;

      //Select ul element
      var list = document.getElementById("list").lastChild;
      //Set inner html to empty string to clear the content
      list.innerHTML = "";
      //loop through students and set the appropriate html element values
      for(var i = 0; i < student.length; i++){
        //check whether student[i] studies study which is put as a paramter into the function
        if(student[i].study === study){
          //Create new li element
          var li = document.createElement('li');
          //Into li element add a new text node which contains all data about the student
          li.appendChild(document.createTextNode(student[i].name + ' ' + student[i].second_name));
          //add li element into ul
          list.appendChild(li); 
        }
      }
      console.log('LEAVE show('+study+')');

    }

</script>