87,922
社区成员
发帖
与我相关
我的任务
分享javascript控制table的问题！ 高手来！！
是这样的，我html中有这么一句话<tr class="t_tr" valign="top" style="line-height: 22px;">
我在JS里的代码如下：
var row=document.createElement("tr");
问题是如何设置row的样式和html中的一样？
我在JS里的代码如下：
var row=document.createElement("tr");
问题是如何设置row的样式和html中的一样？
...全文
请发表友善的回复…
发表回复
xiaofan_sap 2010-05-07
- 打赏
- 举报
[Quote=引用 2 楼 sharp_ice 的回复:]
加上一个ID：
<tr id="tplRow" class="t_tr" valign="top" style="line-height: 22px;">
然后
var templateRow=document.getElementById("tplRow"); //最好保存为全局变量，以便多次使用
var newRow=templateRow.cloneNode(true); //深……
[/Quote]
cloneNode(true); //深……深拷贝?
加上一个ID：
<tr id="tplRow" class="t_tr" valign="top" style="line-height: 22px;">
然后
var templateRow=document.getElementById("tplRow"); //最好保存为全局变量，以便多次使用
var newRow=templateRow.cloneNode(true); //深……
[/Quote]
cloneNode(true); //深……深拷贝?
clarck_913 2010-05-07
- 打赏
- 举报
首先拿到你的tr对象，
然后
var newTr = tr.cloneNode(true);
最后把你的这个 newTr追加到table中
ws_hgo 2010-05-07
- 打赏
- 举报
<!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>
<script src="../jquery-1.4.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$("#t1").addClass("C1");
$("#t2").addClass("C3");
})
</script>
<style type="text/css">
.C1
{
background-color:Red;
}
.C2
{
background-color :Black;
}
</style>
</head>
<body>
<table>
<tr id="t1">
<td>ws_hgo</td>
</tr>
<tr id="t2">
<td>guo</td>
</tr>
</table>
</body>
</html>
海的童话 2010-05-07
- 打赏
- 举报
设置是设置好了 现在有个新问题就是 table中的数据一多 就与列头分开了 中间有一片空白 晕~
我HTML代码：
<table width="98.5%" border="1" align="center" cellpadding="0" cellspacing="0" bordercolor="#F6F6F6" class="t_table" id="table1" >
<tbody id="alarmlist" name="alarmlist">
<tr class="t_tr" valign="top" style="line-height: 22px;">
<td width="2%" align="center" class="color"></td></tr></table>
js代码：
DWRUtil.removeAllRows("alarmlist");
CollectGarbage();
var row=document.createElement("tr");
row.valign="top";
row.style.lineHeight="22px";
row.className="t_tr";
var cell=document.createElement("td");
row.appendChild(cell);
document.getElementById("alarmlist").appendChild(row);
html没问题 就是JS调用的时候 就这样，数据一多列头就与table中的数据分开了 不知道怎么回事。。。
我HTML代码：
<table width="98.5%" border="1" align="center" cellpadding="0" cellspacing="0" bordercolor="#F6F6F6" class="t_table" id="table1" >
<tbody id="alarmlist" name="alarmlist">
<tr class="t_tr" valign="top" style="line-height: 22px;">
<td width="2%" align="center" class="color"></td></tr></table>
js代码：
DWRUtil.removeAllRows("alarmlist");
CollectGarbage();
var row=document.createElement("tr");
row.valign="top";
row.style.lineHeight="22px";
row.className="t_tr";
var cell=document.createElement("td");
row.appendChild(cell);
document.getElementById("alarmlist").appendChild(row);
html没问题 就是JS调用的时候 就这样，数据一多列头就与table中的数据分开了 不知道怎么回事。。。
wwq0123 2010-05-07
- 打赏
- 举报
加ID
<tr id="tplRow" class="t_tr" valign="top" style="line-height: 22px;">
//获取到tp1Row的所有外联内嵌的样式
var rowstyle= window.getComputedStyle ? window.getComputedStyle(templateRow, null):templateRow.currentStyle;
<tr id="tplRow" class="t_tr" valign="top" style="line-height: 22px;">
//获取到tp1Row的所有外联内嵌的样式
var rowstyle= window.getComputedStyle ? window.getComputedStyle(templateRow, null):templateRow.currentStyle;
wwq0123 2010-05-07
- 打赏
- 举报
[Quote=引用楼主 w2521753 的回复:]
是这样的，我html中有这么一句话<tr class="t_tr" valign="top" style="line-height: 22px;">
我在JS里的代码如下：
var row=document.createElement("tr");
问题是如何设置row的样式和html中的一样？
[/Quote]
是这样的，我html中有这么一句话<tr class="t_tr" valign="top" style="line-height: 22px;">
我在JS里的代码如下：
var row=document.createElement("tr");
问题是如何设置row的样式和html中的一样？
[/Quote]
<tr class="t_tr" valign="top" style="line-height: 22px;">
var templateRow=document.getElementById("tplRow");
var rowstyle= window.getComputedStyle ? window.getComputedStyle(templateRow, null):templateRow.currentStyle;
row.style.lineHeight = rowstyle.lineHeight;
shan1119 2010-05-07
- 打赏
- 举报
<script>
window.onload=function(){
var tbl=document.getElementById("tbl1").childNodes[0];
for(var i=0;i<2;i++){
var row=document.createElement("tr");
var cel=document.createElement("td");
row.className="t_tr";
row.style.lineHeight="22px";
cel.innerHTML="xxx";
row.appendChild(cel);
tbl.appendChild(row);
}
}
</script>
<table id=tbl1>
<tr class="t_tr" valign="top" style="line-height: 22px;"><td>1</td></tr>
<tr class="t_tr" valign="top" style="line-height: 22px;"><td>2</td></tr>
</table>
window.onload=function(){
var tbl=document.getElementById("tbl1").childNodes[0];
for(var i=0;i<2;i++){
var row=document.createElement("tr");
var cel=document.createElement("td");
row.className="t_tr";
row.style.lineHeight="22px";
cel.innerHTML="xxx";
row.appendChild(cel);
tbl.appendChild(row);
}
}
</script>
<table id=tbl1>
<tr class="t_tr" valign="top" style="line-height: 22px;"><td>1</td></tr>
<tr class="t_tr" valign="top" style="line-height: 22px;"><td>2</td></tr>
</table>
海的童话 2010-05-07
- 打赏
- 举报
用了2楼的方法 不行啊...
我主要想得到style="line-height: 22px"；
其他2个可以用row.className 和row.valign获取到；
我主要想得到style="line-height: 22px"；
其他2个可以用row.className 和row.valign获取到；
蓝色_冰点 2010-05-07
- 打赏
- 举报
加上一个ID：
<tr id="tplRow" class="t_tr" valign="top" style="line-height: 22px;">
然后
var templateRow=document.getElementById("tplRow"); //最好保存为全局变量，以便多次使用
var newRow=templateRow.cloneNode(true); //深层拷贝一个dom，包括它的任何属性
<tr id="tplRow" class="t_tr" valign="top" style="line-height: 22px;">
然后
var templateRow=document.getElementById("tplRow"); //最好保存为全局变量，以便多次使用
var newRow=templateRow.cloneNode(true); //深层拷贝一个dom，包括它的任何属性
挨踢直男 2010-05-07
- 打赏
- 举报
row.className="t_tr"
