2015-07-20 30 views
1

我聲明瞭4個對象,並將它們推入數組myArray。現在我想用JavaScript在一個表格中打印這個數組。如何使用JavaScript打印對象數組

這裏是我的代碼:

<style> 
 
    #div1 
 
    { 
 
    background:pink; 
 
    width:100%; 
 
    height:80%; 
 
    padding:5%; 
 
    border:1px solid black; 
 
    } 
 
    table,th,td { 
 
    border:1px solid black; 
 
    padding:1px; 
 
    } 
 
</style>
<!DOCTYPE html> 
 
<html xmlns="http://www.w3.org/1999/xhtml"> 
 
<head> 
 
    <title></title> 
 
    <style> 
 
    #div1 
 
    { 
 
     background:pink; 
 
     width:100%; 
 
     height:80%; 
 
     padding:5%; 
 
     border:1px solid black; 
 
    } 
 
    table,th,td { 
 
     border:1px solid black; 
 
     padding:1px; 
 
    } 
 
    </style> 
 
</head> 
 
<body> 
 
    <div id="div1"> 
 
    <table> 
 
     <script> 
 
     var student1 = { Name: "Amol", rno: 1, Class: "MCA", Div: "A" }; 
 
     var student2 = { Name: "Sagar", rno: 2, Class: "MBA", Div: "B" }; 
 
     var student3 = { Name: "Bhushan", rno: 1, Class: "MMM", Div: "C" }; 
 
     var student4 = { Name: "Nachiket", rno: 1, Class: "MPM", Div: "A" }; 
 

 
     var MyArray = []; 
 
     myArray[0].push(student1); 
 
     myArray[1].push(student2); 
 
     myArray[2].push(student3); 
 
     myArray[3].push(student4); 
 

 
     //document.write("<tr><th>"+ Name+</th>"+ 
 
     //"<th>RollNumber</th>" 
 
     //"<th>Class</th>" 
 
     //"<th>Division</th>"); 
 
     //"</tr>" 
 
     alert("p"); 
 
     
 
     for (var i = 0; i < MyArray.length; i++) { 
 
      document.write("<tr><td>" + MyArray[i].Name + "</td>"); 
 
      document.write("<td>" + MyArray[i].rno + "</td>"); 
 
      document.write("<td>" + MyArray[i].Class + "</td></tr>"); 
 
      document.write("<td>" + MyArray[i].Div + "</td></tr></br>"); 
 
     } 
 
     </script> 
 
    </table> 
 
    </div> 
 
</body> 
 
</html>

回答

1

您需要更新

myArray[0].push(student1); 
myArray[1].push(student2); 
myArray[2].push(student3); 
myArray[3].push(student4); 

myArray.push(student1); 
myArray.push(student2); 
myArray.push(student3); 
myArray.push(student4); 
2

有幾英里賭注在你的代碼:

  1. 您已經使用和myArray互換,所以使它保持一致。
  2. 當您在數組中推入項目時,請不要使用索引。正確的語法是:myArray.push(student1);

所以,你的代碼就變成了:

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title></title> 
    <style> 
     #div1 
     { 
      background:pink; 
      width:100%; 
      height:80%; 
      padding:5%; 
      border:1px solid black; 

     } 
     table,th,td { 
      border:1px solid black; 
      padding:1px; 
     } 
    </style> 

</head> 
<body> 
    <div id="div1"> 
     <table> 
      <script> 
       var student1 = { Name: "Amol", rno: 1, Class: "MCA", Div: "A" }; 
       var student2 = { Name: "Sagar", rno: 2, Class: "MBA", Div: "B" }; 
       var student3 = { Name: "Bhushan", rno: 1, Class: "MMM", Div: "C" }; 
       var student4 = { Name: "Nachiket", rno: 1, Class: "MPM", Div: "A" }; 

       var myArray = []; 
       myArray.push(student1); 
       myArray.push(student2); 
       myArray.push(student3); 
       myArray.push(student4); 

       //document.write("<tr><th>"+ Name+</th>"+ 
       //"<th>RollNumber</th>" 
       //"<th>Class</th>" 
       //"<th>Division</th>"); 
       //"</tr>" 
       alert("p"); 
       for (var i = 0; i < myArray.length; i++) { 

        document.write("<tr><td>" + myArray[i].Name + "</td>"); 
        document.write("<td>" + myArray[i].rno + "</td>"); 
        document.write("<td>" + myArray[i].Class + "</td></tr>"); 
        document.write("<td>" + myArray[i].Div + "</td></tr></br>"); 
       } 
    </script> 
     </table> 

    </div> 

</body> 
</html> 

見工作plunkr: 「http://plnkr.co/edit/D3zEFzOPqJWLHOTd2KvN?p=preview

+0

非常感謝你先生 –

+0

歡迎您:)不要給予好評和接受,如果有用的:) –