AJax技术

AJAX编程技巧:在页面上中如何将收到的xml文件显示为表格的形式

字号+ 作者:H5之家 来源:H5之家 2017-05-05 10:00 我要评论( )

假如我们接收到了如下 #26684;式的文件,希望用表 #26684;的形式在页面上展示: entity row field name= id value= 1 / field name= username value= 张三 / /ro

假如我们接收到了如下格式的文件,希望用表格的形式在页面上展示:
<entity>
<row>
<field name="id" value="1"/>
<field name="username" value="张三"/>
</row>
<row>
<field name="id" value="2"/>
<field name="username" value="李四"/>
</row>
</entity>


首先,在页面上定义好准备显示数据的表格,
<table id="resultstable" width="95%" border="1">
<tbody id="resultbody">

</tbody>
</table>
注意:tbody是必须的,否则就不能使用许多js表格方法。


在js中,使用下面的方法,就可以显示数据了:
function listAllData(){
var xmlDoc=xmlHttp.responseXML;
var rows=xmlDoc.getElementsByTagName("row");

var out="";
for(var i=0;i<rows.length;i++){
var field=rows[i].getElementsByTagName("field");
var row=document.createElement("tr");
for(var j=0;j<field.length;j++){
var cell=document.createElement("td");
var textNode=document.createTextNode(field[j].getAttribute("value"));
cell.appendChild(textNode);
row.appendChild(cell);
}
document.getElementById("resultbody").appendChild(row);
}
}


当然,还需要许多相关的方法,但都比较简单,就不一一介绍了。

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • AJAX编程技巧:在Struts Action中如何向客户端发送xml文件?

    AJAX编程技巧:在Struts Action中如何向客户端发送xml文件?

    2017-05-05 09:07

  • Ajax 从XML到生成表格

    Ajax 从XML到生成表格

    2017-03-25 16:01

  • 无插件Vim编程技巧

    无插件Vim编程技巧

    2016-10-23 18:00

  • 《电脑编程技巧与维护》2010年13期

    《电脑编程技巧与维护》2010年13期

    2016-09-21 10:01

网友点评
-