javascript动态操作表格

比如说我们在发送ajax后返回的JSON格式的字符串，那么我们要把这些数据放入HTML应该怎么办呢？
在现在的页面布局中，table的使用很少了，但是在展现列表等数据的时候还是会使用table，原因只因为table比div更方便，所以用JS操作table也是经常使用的，好了，还是看代码，
ajax发送过程就不写了，这里的是ajax的onreadystatechange调用函数
假设我们这里的data = [{"username":"张三","age":"25"},{"username":"李四","age":"30"}]

function show(){
	var data = ajax.responseText;//返回数据---JSON格式字符串
	data = data.replace(/^\s*/, "").replace(/\s*$/, "");//取出返回数据里面多余的空值
	data = eval('('+data+')'); //将JSON格式字符串转换为JSON对象
           var tab = document.getElementById("table_id");//获取页面的table
           for(var i=0;i<data.length;i++){
                    var newLine = tab.insertRow();//添加一行
                       var newCell1 = newLine.insertCell();
                    var newCell2 = newLine.insertCell();
                    newCell1.innerHTML=data[i].username;
                    newCell2.innerHTML=data[i].age;
         }
}

好了现在我们的数据就展现在前端HTML页面了！
这一次写的有点差，多多见谅，这是想把我的学习内容分享给大家， 最近项目里面的ajax用的很多，所以基本上都是写的这方面的内容。

评论

14 楼 lucky16 2010-04-14  

rainsilence 写道

1。insertRow，insertCell是DHTML接口，不是w3c标准，速度慢。
2。强烈建议使用createDocumentFragment

谢谢提醒，回去修改！

13 楼 rainsilence 2010-04-14  

1。insertRow，insertCell是DHTML接口，不是w3c标准，速度慢。
2。强烈建议使用createDocumentFragment

12 楼 select*from爱 2010-04-14  

jquery?

11 楼 fyland 2010-04-14  

function getJson( str ){
       return  (new Function("return "+str))();
}

10 楼 lucky16 2010-04-14  

天蝎鱼 写道

data = eval('('+data+')');
ff好像不支持吧

FF好像是不支持的，我们项目要求就是IE，FF不是很在意，所以就用了这么一个办法咯！呵呵，要兼容FF，改一下这里就可以了！

9 楼 lucky16 2010-04-14  

20055294 写道

这个 就是 我第一个项目用的

呵呵。也是我第一个正式项目用的，

8 楼 fengsky491 2010-04-14  

据说，数据量大的时候用innerHTML速度快

7 楼 Zahir 2010-04-14  

数据量比较大的情况下，是不是先createDocumentFragment好一点？

6 楼 fxyc 2010-04-13  

非常简洁啊

5 楼 天蝎鱼 2010-04-13  

data = eval('('+data+')');
ff好像不支持吧

4 楼 20055294 2010-04-13  

这个 就是 我第一个项目用的

3 楼 robyjeffding 2010-04-13  

见图见真相

2 楼 lucky16 2010-04-13  

yescpu 写道

确实，很基础～～～，但我也正适合我！

呵呵。可以多交流交流，昨天认识了一位这方面的高手！

1 楼 yescpu 2010-04-12  

确实，很基础～～～，但我也正适合我！