簡體   English   中英

如何使用JavaScript打印對象數組

[英]How to print an object array with JavaScript

我聲明了4個對象並將它們推送到數組myArray 現在我想使用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. 您可以互換使用MyArraymyArray ,因此請保持一致。
  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>

查看工作插件:“ http://plnkr.co/edit/D3zEFzOPqJWLHOTd2KvN?p=preview

你需要更新

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);

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM