Frame里元素的应用和表格动态创建

最新推荐文章于 2025-08-11 19:52:03 发布

原创最新推荐文章于 2025-08-11 19:52:03 发布 · 1.0k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#table #function #javascript #class #string #input

JavaScript 专栏收录该内容

4 篇文章

订阅专栏

博客主要围绕JavaScript展开，给出了对表格进行动态添加和删除行的函数示例。添加行函数addRow可将指定表格的指定行作为模版行进行增加，删除行函数delRow能根据行的id属性删除表格中的指定行，还包含了相关的参数检查和操作逻辑。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

tableId.rows[0].cells[0].innerHTML="i love javascript! ";
document.getElementById(vel).innerText = T1.value;
parent.document.all("ifrmAddExam").style
parent.frames("table_index").tblAddExam.style.pixelLeft=0;
parent.frames("table_index").location.href="pp.php";
document.frames("ifrmAddExam").examDate.value
<body style="overflow-x:hidden;">
<body style="overflow-y:auto;">

outerHTML

给一段示例：
/******************************************
*包含对表格进行动态添加,删除行的函数
*调用时需先建立表格和作为模版的一行
*jianyi0115 2004 7 16
*注意：执行history.back() 返回后，新行会消失
*IE6 测试通过
******************************************/

/********************************
*添加行(将指定表格table的指定行作为模版行进行动态增加。
*@param tableID string 表格的id,
*@param rowIndex int 模版行索引,最好将模版行隐藏，因为新行完全复制模版行内容
***/
    function addRow(tableID,rowIndex)
    {
  if(typeof(tableID) == "undefined" ){
   alert("请指定操作的表格ID！(tableID)");
   return;
  }
  if(typeof(rowIndex) == "undefined" ) rowIndex = 1;

  var tableObj = document.getElementById(tableID);

  if( tableObj.tagName != "TABLE" ){
   alert("对象不是表格");
   return;
  }

  var colsCount = tableObj.rows( rowIndex ).cells.length;

  if( colsCount < 1 ){
   alert("表格对象无单元格!");
   return;
  }

  var rowsCount = tableObj.rows.length;

  if( rowIndex > ( rowsCount + 1 ) ){
   alert("索引超出范围!");
   return;
  }

  var lastID = tableObj.rows( tableObj.rows.length - 1 ).id;

  var trID = tableID + "_";

  if( rowsCount <= 2 )
   trID += "1";
  else
  {
   last = lastID.split( "_" );
   lastNum = last[1];
   trID += ( 1 + parseInt( lastNum ) );
  }
  //alert( trID );

  tableObj.insertRow();

  tableObj.rows( tableObj.rows.length - 1 ).id = trID;

  rowsCount = tableObj.rows.length;

  for( i = 0; i < colsCount - 1; i ++ )
  {
   tableObj.rows( rowsCount - 1 ).insertCell();
   tableObj.rows( rowsCount - 1 ).cells(i).align = "center";
   tableObj.rows( rowsCount - 1 ).cells(i).innerHTML = tableObj.rows( rowIndex ).cells(i).innerHTML;

  }

  tableObj.rows( rowsCount - 1 ).insertCell();
  tableObj.rows( rowsCount - 1 ).cells(i).align = "center";
  //tableObj.rows( rowsCount - 1 ).cells(i).innerHTML = "<input type=/"button/" value=/"删除/" onclick=/"delRow('"+tableID+"','"+trID+"')/" >";

  //tableObj.rows( rowsCount - 1 ).cells(i).innerHTML = "<img class='hand' src='../../images/dialog/delete.gif' title='删除此行' onclick=/"delRow('"+tableID+"','"+trID+"')/" >";
  tableObj.rows( rowsCount - 1 ).cells(i).innerHTML = "<a class='hand' src='../../images/dialog/delete.gif' title='删除此行' onclick=/"delRow('"+tableID+"','"+trID+"')/" >删除</a>";
   // alert( tableObj.innerHTML );<img src='../../images/dialog/delete.gif' onclick=delRow('1')>
    }

/**
*删除表格中的一行
*@tableID 表格ID
*@trID 要删除的行的id属性
*/
    function delRow(tableID,trID)
    {

  var tableObj = document.getElementById(tableID);

  var rowsCount = tableObj.rows.length ;

  for( i = 0; i < rowsCount ; i ++ )
  {
   //alert{tableObj.rows( i ).id};
   if( typeof(tableObj.rows( i ).id) != "undefined" && tableObj.rows( i ).id == trID )
   {
    tableObj.deleteRow( i );
    break;
   }

  }
    }