js中table里的每一行怎么去获得它的行号？

最新推荐文章于 2023-03-18 13:21:57 发布

iteye_20061

最新推荐文章于 2023-03-18 13:21:57 发布

阅读量505

点赞数

CC 4.0 BY-SA版权

文章标签： jQuery JavaScript C C++ C# ViewUI

本文链接：https://blog.youkuaiyun.com/iteye_20061/article/details/81755392

本文提供了一段简单的JavaScript代码，用于实现HTML表格中的行操作，包括获取行号和删除行的功能。通过点击按钮即可轻松实现这些功能，适用于初学者学习。

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

/*********↑不要把简单的问题复杂化**********/
/*****不管是动态生成还是静态生成，此方法通杀******/
直接代码复制出去运行，我已经尽量写简单了，如果你还是不明白，那么...我...

<html>
<head>
<title>1</title>
<script>
//得到行对象
function getRowObj(obj)
{
   var i = 0;
   while(obj.tagName.toLowerCase() != "tr"){
    obj = obj.parentNode;
    if(obj.tagName.toLowerCase() == "table")
  return null;
   }
   return obj;
}

//根据得到的行对象得到所在的行数
function getRowNo(obj){
   var trObj = getRowObj(obj);
   var trArr = trObj.parentNode.children;
for(var trNo= 0; trNo < trArr.length; trNo++){
if(trObj == trObj.parentNode.children[trNo]){
    alert(trNo+1);
}
}
}

//删除行
function delRow(obj){
    var tr = this.getRowObj(obj);
   if(tr != null){
    tr.parentNode.removeChild(tr);
   }else{
    throw new Error("the given object is not contained by the table");
   }
}
</script>
</head>

<body>
<table border = "1">
<tr>
<td>A<input type="button" value="A" onclick="getRowNo(this)">getRowNo<td>
</tr>
<tr>
<td>B<input type="button" value="B" onclick="delRow(this)">delRow<td>
</tr>
<tr>
<td>C<input type="button" value="C" onclick="getRowNo(this)">getRowNo</td>
</tr>
<tr>
<td>D<input type="button" value="D" onclick="getRowNo(this)">getRowNo</td>
</tr>
</table>
</body>
<html>