用javascript如何从tr中分别获得每个td的元素

用javascript如何从tr中分别获得每个td的元素,第1张

js获取表格中每行的td元素方法:

<script>

var tb = documentgetElementById("tb");  //根据id找到这个表格

    var rows = tbrows;               //取得这个table下的所有行
    for(var i=0;i<rowslength;i++)//循环遍历所有的tr行
    {
      for(var j=0;j<rows[i]cellslength;j++)//取得第几行下面的td个数,再次循环遍历该行下面的td元素
      {
         var cell = rows[i]cells[j];//获取某行下面的某个td元素

       alert("第"+(i+1)+"行第"+(j+1)+"格的数字是"+cellinnerHTML);//cellinnerHTML获取元素里头的值  

}

}

</script>

拓展使用jq几行命令就能实现获取td的值

$("#tb tr td")each(function(i, v){    //针对tb表格下的所有td进行遍历
        alert("第"+(i + 1)+"格的数字是"+$(this)text());//返回当前td下的值
})

for(var i=1;i<10;i++){
    $("td")[i]styledisplay="";
}
for(var i=10;i<22;i++){
    $("td")[i]styledisplay="none";
}

或者:

$("td:lt(10):gt(0)")css("display","");
$("td:lt(22):gt(9)")css("display","none");

var delTableRow = function(btn){
var tr = btnparentElementparentElement;
var tbody = trparentElement;
tbodydeleteRow(trrowIndex);
}
---------------------
<td>
<button class="btn btn-xs btn-default" onclick="delTableRow(this)"><%-- alert(${itemid}) delTableRow(this) ) --%><i class="icon-remove"></i> </button>
</td>

这个效果可以不用js,直接用css伪类就行
tr:hover{background:#F7F2C8}
tr show{display:none;}
tr shwo:hover{display:block;}
show就是移动、编辑、删除的那个容器

insertRow()函数可以带参数,形式如下:这个函数将新行添加到index的那一行前,比如insertRow(0),是将新行添加到第一行之前。默认的insertRow()函数相当于insertRow(-1),将新行添加到表的最后。

<script>
var te = documentgetElementById('text1');
var par = teparentNodeparentNode;
alert(parinnerHTML);
parstyledisplay='none';
</script>

因为你的方法写错了。。。。
不是getElementByTagName
而是getElementsByTagName
因为这样获取到的元素可能不止一个,所以这个方法的命名里体现出来了Elements注意这个s
getElementById的话,由于具有唯一性,所以名字里是Element


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/yw/13335646.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-07-17
下一篇 2023-07-17

发表评论

登录后才能评论

评论列表(0条)

保存