我是很清楚你的代码要做什么，你代码中有几错错误：
1：i、s、n、p都没有定义
2：你只定义了一个var td，这个只有最后一个add会追加。
下面是我根据你的代码调整你，你看看吧。
我觉得你这样的代码没有什么实际的意义，你要这么实现实在不是好办法。
<html><head>
<title></title>
<script>
function addTbody() {
var i = "我是i" var s = "我是s" var n = "我是n" var p = "我是p"
var tbody = document.createElement("tbody") //新建一个tbody类型的Element节
var tr = document.createElement("tr") //新建一个tr类型的Element节点
var td1 = document.createElement("td") //新建一个td类型的Element节点
td1.innerHTML = i
tr.appendChild(td1)
var td2 = document.createElement("td") //新建一个td类型的Element节点
td2.innerHTML=s
tr.appendChild(td2)
var td3 = document.createElement("td") //新建一个td类型的Element节点
td3.innerHTML="免费赠送5套餐具"
tr.appendChild(td3)
var td4 = document.createElement("td") //新建一个td类型的Element节点
td4.innerHTML =n
tr.appendChild(td4)
var td5 = document.createElement("td") //新建一个td类型的Element节点
td5.innerHTML ="￥"+p
tr.appendChild(td5)
var td6 = document.createElement("td") //新建一个td类型的Element节点
td6.innerHTML ='1'
tr.appendChild(td6)
tbody.appendChild(tr) //将节点tr加入tbody中
var parNode = document.getElementById("table1") //定位到table上
parNode.appendChild(tbody)
}
</script>
</head>
<body>
<a onclick="addTbody()" href="#">添加tbody</a>
<table id="table1">
</table>
</body>
</html>
原声js中如果你想创建tr和td 而且是很多个，只能用循环往里面塞值了。
<body><table id="tab"></table>
</body>
<script>
var oTab = document.getElementById('tab')
for(var i=0i<3i++){
var oTr = document.createElement('tr')
for(var j=0j<3j++)
{
var oTd = document.createElement('td')
oTr.appendChild(oTd)
}
oTab.appendChild(oTr)
}
</script>
简单的写了一下，仅供参考~~
jQuery 添加新内容有以下四个方法：
append() - 在被选元素的结尾插入内容
prepend() - 在被选元素的开头插入内容
after() - 在被选元素之后插入内容
before() - 在被选元素之前插入内容
下面实例演示：点击按钮则在表格数据区域增加一行
1、HTML结构
<table id = "test"><thead>
<tr><th>列1</th><th>列2</th><th>列3</th></tr>
</thead>
<tbody>
<tr><td>1</td><td>1</td><td>2</td></tr>
<tr><td>2</td><td>4</td><td>5</td></tr>
</tbody>
</table>
<input type="button" id="btn1" value="在开头增加">
<input type="button" id="btn2" value="在末尾增加">
2、jquery代码
$(function(){$("#btn1").click(function() {
$("#test tbody").prepend('<tr><td></td><td></td><td></td></tr>')
})
$("#btn2").click(function() {
$("#test tbody").append('<tr><td></td><td></td><td></td></tr>')
})
})
3、效果演示
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）