如何使用JS脚本添加表格的行和列

如何使用JS脚本添加表格的行和列,第1张

<table border="1">

<tbody id="new">

<tr><td>a</td><td>1</td></tr>

<tr><td>b</td><td>2</td></tr>

<tr><td>c</td><td>3</td></tr>

</tbody>

</table>

<script type="text/javascript">

var table = document.getElementById("new")

// 增加

var newTR= document.createElement("tr")

var newTD1 = document.createElement("td")

var newText1 = document.createTextNode("d")

var newTD2 = document.createElement("td")

var newText2 = document.createTextNode("4")

newTD1.appendChild(newText1)

newTD2.appendChild(newText2)

newTR.appendChild(newTD1)

newTR.appendChild(newTD2)

table.appendChild(newTR)

//增加列

var tr = table.getElementsByTagName("tr")

for(var i=0i<tr.lengthi++) {

var newTD = document.createElement("td")

var newText = document.createTextNode(i)

newTD.appendChild(newText)

tr[i].appendChild(newTD)

}

</script>

首先定义一个闭包,如下:

var appendText = function(){

//变量作用域为函数内部,外部无法访问

var html = ""

return {

getHtml : function(tmpNum){

html += "<input type='text' name='txt"+tmpNum+"'>"

return html

}

}

}()

然后修改你的代码

oTD.innerHTML = appendText.getHtml(tmpNum)

或者有兴趣的话可以学习一下Jquery,里面有相应方法很轻松地实现你的需求。


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

原文地址: http://outofmemory.cn/bake/11737850.html

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

发表评论

登录后才能评论

评论列表(0条)

保存