js遍历table下面 所有td,并设置个别td的值 高分 求大神 120
<tableid="mytable"><trcalss="test"><tdid="d1">4</td><tdid="d2">5</td><tdid="d3"></td>...
<table id="mytable">
<tr calss="test">
<td id="d1">4</td>
<td id="d2">5</td>
<td id="d3"></td>
</tr>
<tr calss="test">
<td id="d1">1115</td>
<td id="d2">11116</td>
<td id="d3"></td>
</tr>
</table>
如上table已知table的id、tr的class、td的id,一个table里有多个相同的tr,每个tr的class和id一样 但是值不一样
求大神 遍历table后设置td的id为d3的值为d1+d2
跪求大神 展开
<tr calss="test">
<td id="d1">4</td>
<td id="d2">5</td>
<td id="d3"></td>
</tr>
<tr calss="test">
<td id="d1">1115</td>
<td id="d2">11116</td>
<td id="d3"></td>
</tr>
</table>
如上table已知table的id、tr的class、td的id,一个table里有多个相同的tr,每个tr的class和id一样 但是值不一样
求大神 遍历table后设置td的id为d3的值为d1+d2
跪求大神 展开
5个回答
展开全部
这个很简单啊
html :
<table id="table">
<tbody>
<tr>
<td>1</td>
<td>2</td>
<td></td>
</tr>
扒轿 </tbody>
</table>
这个是上面的,需求要第三个td的值要等于前两个td的值相加
下面是俩个版本的js代码
js:
//jquery :
//jq的实现很简单
var table = $('#table');//找到这个table
var trs = table.find('tbody tr');//找到这个表格下面的tbody下面的所有的tr
trs.each(function(){
var tr = $(this);//针对每个tr做处理
var tds = tr.find('td');//拿到这个tr下面所有的td
if(tds.length === 3){//只处理下面有3个td的情况
var num_1 = +tds.eq(0).text();//第一个td的值,前面正歼的+号可以将他转换成数字用来计算
var num_2 = +tds.eq(0).text();//第二个td的值
tds.eq(2).text(num_1 + num_2);//第三个td的值等于他前俩个td的值相加
}
});
//原生js的,ie8+支持
var table = document.querySelector('#table');
var trs = tbody.querySelectorAll('tbody > tr');
for(var i=0,tr; tr = trs[i]; i++){
var tds = tr.querySelectorAll('td');
if(tds.length === 3){
春清肆 var n1 = +tds[0].innerText;
var n2 = +tds[1].innerText;
tds[2].innerText = n1 + n2;
}
}
追问
不行额
追答
那我就没招了,你自己跑不起来,我也没法子帮你
展开全部
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<困判title>test jquery</title>
<script src="jquery.js"></script>
<script type="text/javascript">
function add(a,b){
return parseInt(a,10) + parseInt(b,10);
}
$(function(){
$(".test").toArray().forEach(function(x){
$("#d3", $(x)).text(add($("#d1",$(x)).text(), $("#d2",$(x)).text()));
});
});
</script>
</head>
<body>
<table id="mytable">
<tr class="test">
<td id="d1">4</td>
<td id="汪芦改d2">5</td>
<td id="d3"></td>
</tr>
<tr class="test">
<td id="d1">1115</td>
<td id="d2">11116</td>
<td id="d3"></td>
</tr>
</table>
</body>
</html>
你原来的class单词拼写错了. 这里用到了jquery,自己看下. 测试哗启是成功的
追问
不行额
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
用原生js太麻烦了,我卖塌用了jquery 写了个出来(ps ID是唯一的虽然可以用,但是不建议id重复)
<!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>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="zh-CN" />
<meta name="Keywords" content="" />
<meta name="Description" content="" />
<link rel="stylesheet" href="style/.css" type="text/css" />
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#mytable tr").each(function(k){
$(this).find("#d3").text(Number($(this).find("#d1").text())+Number($(this).find("#d2").text()));
});
});
</script>
</head>
<body>
<table id="mytable">
<tr calss="test">
<td id="d1">4</td>
<td id="d2">5</td>
<td id="d3"></td>
</tr>
<tr calss="test">
中做圆 <td id="d1">1115</td>
<td id="d2">11116</td>
<td id="d3"></td>
</tr>
</table>
</body>
</html>
追问
不行额
追答
怎么会不行,直接复制就行了,当然jquery 百度提供的,首先你的电脑得能上网
看了一下几个人回答的问题都是可以的,楼主只是不想给分
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
<!DOCTYPE HTML>败档
<html>
<head>
<meta charset="UTF-8" />
<title>main.html</title>
<style type="text/css">
</style>
<script type="text/javascript">
window.onload = function ()
{
var table = document.getElementById ('mytable');
察慧乱 var rows = table.rows;
碧粗 for ( var i = 0; i < rows.length; i++)
{
if (rows[i].className == 'test')
{
var txt = document.createTextNode ();
txt.nodeValue = Number (rows[i].cells[0].firstChild.nodeValue)
+ Number (rows[i].cells[1].firstChild.nodeValue);
rows[i].cells[2].appendChild (txt);
}
}
}
</script>
</head>
<body>
<table id="mytable">
<tr class="test">
<td id="d1">4</td>
<td id="d2">5</td>
<td id="d3"></td>
</tr>
<tr class="test">
<td id="d1">1115</td>
<td id="d2">11116</td>
<td id="d3"></td>
</tr>
</table>
</body>
</html>
追问
不行额
追答
你的tr的class都写错了
calss="test"
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
2014-12-08
展开全部
【每个tr的渗空class和id一样】?(id可以相同?)
【遍历table后设置td的id为d3的值为d1+d2】?(di+d2 什么意思,怎么个加法?)
才疏丛大瞎学浅,表示不太仿漏明白,但是帮你顶下。
【遍历table后设置td的id为d3的值为d1+d2】?(di+d2 什么意思,怎么个加法?)
才疏丛大瞎学浅,表示不太仿漏明白,但是帮你顶下。
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询