[Html]
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<Html xmlns = "http://www.w3.org/1999/xhtml">
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = gb2312"/>
<Title> untitled document </title>
<Style type = "text/css">
Table {
Border: # 0033FF 1px solid;
Width: 600px;
Border-collapse: collapse;
}
Table td {
Border: # 0033FF 1px solid;
Padding: 10px;
}
</Style>
<Script type = "text/javascript">
Function crtTable_1 ()
{
/* Var tabNode = document. createElement ("table ");
Var tbdNode = document. createElement ("tbody ");
Var trNode = document. createElement ("tr ");
Var tdNode = crtNode ("td ");
TrNode. appendChild (tdNode );
TbdNode. appendChild (trNode );
*/
// Create a table object
Var tabNode = document. createElement ("table ");
// Create a row using the insertRow method of the table object
Var trNode = tabNode. insertRow ();
// Create a cell by using the insertCell method of the row object
Var tdNode = trNode. insertCell ();
// Add some content to the cell
TdNode. innerHTML = "one cell ";
// Document. body. appendChild (tabNode );
Var divNode = document. getElementById ("divid ");
DivNode. appendChild (tabNode );
}
// Simplify the document. createElement code
Function crtNode (name)
{
Return document. createElement (name );
}
Function crtTable ()
{
Var tabNode = document. createElement ("table ");
TabNode. setAttribute ("id", "tabid"); // Add an id attribute to the table object.
Var rowNum = document. getElementsByName ("rownum") [0]. value;
Var colNum = document. getElementsByName ("colnum") [0]. value;
For (var x = 1; x <= rowNum; x ++)
{
Var trNode = tabNode. insertRow ();
For (var y = 1; y <= colNum; y ++)
{
Var tdNode = trNode. insertCell ();
TdNode. innerHTML = x + "--" + y;
}
}
Document. getElementById ("divid"). appendChild (tabNode );
Document. getElementsByName ("crtBut") [0]. disabled = true;
}
Function delRow ()
{
Var tabNode = document. getElementById ("tabid ");
If (tabNode = null)
{
Alert ("table does not exist ");
Return;
}
Var rowNum = document. getElementsByName ("delrow") [0]. value;
If (rowNum> = 1 & rowNum <= tabNode. rows. length)
{
TabNode. deleteRow (rowNum-1 );
}
Else
{
Alert ("the number of rows to be deleted does not exist ");
}
}
Function delCol ()
{
// Delete a column: Delete the cell at the specified position in each row.
Var tabNode = document. getElementById ("tabid ");
If (tabNode = null)
{
Alert ("table does not exist ");
Return;
}
Var colNum = document. getElementsByName ("delcol") [0]. value;
Var trs = tabNode. rows; // gets the set of rows.
If (colNum> = 1 & colNum <= trs [0]. cells. length)
{
For (var x = 0; x <trs. length; x ++)
{
Trs [x]. deleteCell (colNum-1 );
}
}
Else
{
Alert ("the number of columns to be deleted does not exist ");
}
}
</Script>
</Head>
<Body>
Number of rows: <input type = "text" name = "rownum"/> <br/>
Number of columns: <input type = "text" name = "colnum"/> <br/>
<Input type = "button" name = "crtBut" value = "create table" onclick = "crtTable ()"/>
<Br/>
<Hr/>
<Input type = "text" name = "delrow"/> <input type = "button" value = "Delete row" onclick = "delRow ()"/> <br/>
<Input type = "text" name = "delcol"/> <input type = "button" value = "delete column" onclick = "delCol ()"/> <br/>
<Div id = "divid">
</Div>
</Body>
</Html>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
