站内搜索
广告
How to Build Tables Dynamically(二)
作者:    来源:    点击:    日期:2007-4-9 23:38:25   
The following example uses the Table Object Model to create the example table used throughout this article.

Show Example
<TABLE ID="oTable" BORDER BGCOLOR="lightslategray">
<TBODY ID="oTBody0"></TBODY>
<TBODY ID="oTBody1"></TBODY>
</TABLE>

<SCRIPT LANGUAGE="JScript">
// Declare variables and create the header, footer, and caption.
var oTHead = oTable.createTHead();
var oTFoot = oTable.createTFoot();
var oCaption = oTable.createCaption();
var oRow, oCell;
var i, j;

// Declare stock data that would normally be retrieved from a stock Web site.
var heading = new Array;

heading[0] = "Stock symbol";
heading[1] = "High";
heading[2] = "Low";
heading[3] = "Close";

var stock = new Array;

stock["0,0"] = "ABCD";
stock["0,1"] = "88.625";
stock["0,2"] = "85.50";
stock["0,3"] = "85.81";

stock["1,0"] = "EFGH";
stock["1,1"] = "102.75";
stock["1,2"] = "97.50";
stock["1,3"] = "100.063";

stock["2,0"] = "IJKL";
stock["2,1"] = "56.125";
stock["2,2"] = "54.50";
stock["2,3"] = "55.688";

stock["3,0"] = "MNOP";
stock["3,1"] = "71.75";
stock["3,2"] = "69.00";
stock["3,3"] = "69.00";

// Insert a row into the header.
oRow = oTHead.insertRow();
oTHead.bgColor = "lightskyblue";

// Insert cells into the header row.
for (i=0; i<4; i++)
{
  oCell = oRow.insertCell();
  oCell.align = "center";
  oCell.style.fontWeight = "bold";
  oCell.innerText = heading[i];
}

// Insert rows and cells into the first body.
for (i=0; i<2; i++)
{
  oRow = oTBody0.insertRow();
  for (j=0; j<4; j++)
  {
    oCell = oRow.insertCell();
    oCell.innerText = stock[i + "," + j];
  }
}

// Set the background color of the first body.
oTBody0.bgColor = "lemonchiffon";
首页 上一页 [1] [2] [3] [4]  下一页 尾页 
How to Build Tables Dynamically(二) 评论