javascript - 需要使用javascript创建HTML表格

Possible Duplicate:
Create HTML table from javascript array

我已经被提供了这样的数组

var univArray = new Array(
        {name: "Stanford University", nick: "Stanford", ownership: "private", sys: "n/a", SATh: 1550, SATl: 1360, tuition: 27204, room: 8680},
        {name: "University of California, Berkeley", nick: "UC Berkeley", ownership: "public", sys: "University of California", SATh: 1440, SATl: 1170, tuition: 4200, room: 10608},
        {name: "University of California, Santa Cruz", nick: "UC Santa Cruz", ownership: "public", sys: "University of California", SATh: 1270, SATl: 1030, tuition: 4384, room: 9708},
        {name: "San Francisco State University", nick: "SFSU", ownership: "public", sys: "CalState", SATh: 1120, SATl: 850, tuition: 1826, room: 6736},
        {name: "San Jose State University", nick: "SJSU", ownership: "public", sys: "CalState", SATh: 1140, SATl: 860, tuition: 1912, room: 7395},
        {name: "Sonoma State University", nick: "Sonoma State", ownership: "public", sys: "CalState", SATh: 1140, SATl: 930, tuition: 2226, room: 9606},
        {name: "California State University, Hayward", nick: "CalState Hayward", ownership: "public", sys: "CalState", SATh: 1050, SATl: 810, tuition: 1800, room: 6435},
        {name: "University of San Francisco", nick: "USF", ownership: "private", sys: "Roman Catholic", SATh: 1240, SATl: 1030, tuition: 21780, room: 9080},
        {name: "Santa Clara University", nick: "SCU", ownership: "private", sys: "Roman Catholic", SATh: 1300, SATl: 1110, tuition: 23445, room: 8904},
        {name: "Mills College", nick: "Mills College", ownership: "private", sys: "n/a", SATh: 1130, SATl: 920, tuition: 19482, room: 7832}
        );

我应该如何使用javascript创建一个表？有人可以提供帮助。

最佳答案

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<script>
function tableView(){
var univArray = new Array(
{name: "Stanford University", nick: "Stanford", ownership: "private", sys: "n/a", SATh: 1550, SATl: 1360, tuition: 27204, room: 8680},
    {name: "University of California, Berkeley", nick: "UC Berkeley", ownership: "public", sys: "University of California", SATh: 1440, SATl: 1170, tuition: 4200, room: 10608},
    {name: "University of California, Santa Cruz", nick: "UC Santa Cruz", ownership: "public", sys: "University of California", SATh: 1270, SATl: 1030, tuition: 4384, room: 9708},
    {name: "San Francisco State University", nick: "SFSU", ownership: "public", sys: "CalState", SATh: 1120, SATl: 850, tuition: 1826, room: 6736},
    {name: "San Jose State University", nick: "SJSU", ownership: "public", sys: "CalState", SATh: 1140, SATl: 860, tuition: 1912, room: 7395},
    {name: "Sonoma State University", nick: "Sonoma State", ownership: "public", sys: "CalState", SATh: 1140, SATl: 930, tuition: 2226, room: 9606},
    {name: "California State University, Hayward", nick: "CalState Hayward", ownership: "public", sys: "CalState", SATh: 1050, SATl: 810, tuition: 1800, room: 6435},
    {name: "University of San Francisco", nick: "USF", ownership: "private", sys: "Roman Catholic", SATh: 1240, SATl: 1030, tuition: 21780, room: 9080},
    {name: "Santa Clara University", nick: "SCU", ownership: "private", sys: "Roman Catholic", SATh: 1300, SATl: 1110, tuition: 23445, room: 8904},
    {name: "Mills College", nick: "Mills College", ownership: "private", sys: "n/a", SATh: 1130, SATl: 920, tuition: 19482, room: 7832}
    );
for (var i = 0; i < univArray.length; i++){addRow("dataTable",univArray[i].name,univArray[i].nick,univArray[i].ownership,univArray[i].sys,univArray[i].SATh,univArray[i].SATl,univArray[i].tuition,univArray[i].room);
//alert(univArray[i].name);
}
}
function addRow(tableID,name,nick,owner,sys,sath,sati,tuition,room) {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;

var row = table.insertRow(rowCount);

var cell1 = row.insertCell(0);
var element1 = document.createElement("input");
element1.type = "text";
cell1.appendChild(element1);
cell1.innerHTML=name;

var cell2 = row.insertCell(1);
var element2 = document.createElement("input");
element2.type = "text";
cell2.appendChild(element2);
cell2.innerHTML=nick;

var cell3 = row.insertCell(2);
var element3 = document.createElement("input");
element3.type = "text";
cell3.appendChild(element3);
cell3.innerHTML=owner;

var cell4 = row.insertCell(3);
var element4 = document.createElement("input");
element4.type = "text";
cell4.appendChild(element4);
cell4.innerHTML=sys;

var cell5 = row.insertCell(4);
var element5 = document.createElement("input");
element5.type = "text";
cell5.appendChild(element5);
cell5.innerHTML=sath;

var cell6 = row.insertCell(5);
var element6 = document.createElement("input");
element6.type = "text";
cell6.appendChild(element6);
cell6.innerHTML=sati;

var cell7 = row.insertCell(6);
var element7 = document.createElement("input");
element7.type = "text";
cell7.appendChild(element7);
cell7.innerHTML=tuition;

var cell8 = row.insertCell(7);
var element8 = document.createElement("input");
element8.type = "text";
cell8.appendChild(element8);
cell8.innerHTML=sath;
}
</script>
<BODY onload='tableView();'>

<TABLE id="dataTable" width="350px" border="1">
<TR>
<TH>name</TH>
<TH>nick</TH>
<TH>ownership</TH>
<TH>sys</TH>
<TH>SATh</TH>
<TH>SATi</TH>
<TH>tuition</TH>
<TH>room</TH>
</TR>

</TABLE>
</BODY>
</HTML>

这对我来说很好