table动态安插HTML行，与insertAdjacentHTML appendChild相似的功能
日期：2014-05-17 浏览次数：20898 次
table动态插入HTML行，与insertAdjacentHTML appendChild相似的功能
对于div等元素来说，插入一段html是很容易的事情，但是对于表格来说就太难了。一般情况下，我们都是用appendChild的方式，一行行、一格格地添加，操作起来很繁锁。能不能拼一串字符，就能直接加入到表格中呢？
下面的例子实现了这个功能，同样地，该例支持IE和firefox。该功能的实现意义重大，这样页面元素的处理，就全部都能够用拼html字串的方法来实现了。
对于div等元素来说，插入一段html是很容易的事情，但是对于表格来说就太难了。一般情况下，我们都是用appendChild的方式，一行行、一格格地添加，操作起来很繁锁。能不能拼一串字符，就能直接加入到表格中呢？
下面的例子实现了这个功能，同样地，该例支持IE和firefox。该功能的实现意义重大，这样页面元素的处理，就全部都能够用拼html字串的方法来实现了。
<html>
<body>
<table id=tb1 border=1 width=100>
<tr><td>1</td></tr>
</table>
<button onclick=run()>插入行</button>
</body>
<script>
function run(){
insTable(document.getElementById("tb1"),"<tr><td>2</td></tr><tr><td>3</td></tr>")
}
function insTable(tb,str){
var o=document.createElement("div"),ol;
o.innerHTML="<table>"+str+"</table>";
ol=o.childNodes[0].tBodies[0].rows;
while(ol.length>0){
tb.tBodies[0].appendChild(ol[0])
}
}
</script>
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
