dhtmlxGrid不仅能够通过addRow方法来逐行的添加数据到表格，也允许使用预先编辑好的xml文件来设置数据（即将数据在xml文件中预先写好），下面通过一个实例来说明如何初始化dhtmlxGrid表格的数据。
先看一下效果图吧，呵呵！！如下图：
XML数据文件如下：
<?xml version="1.0" encoding="UTF-8"?> <rows> <row id="0"> <cell>100</cell> <cell>张三</cell> <cell>男</cell> <cell>20</cell> <cell>028-9090966</cell> </row> <row id="1"> <cell>101</cell> <cell>李四</cell> <cell>男</cell> <cell>24</cell> <cell>028-7892960</cell> </row> <row id="2"> <cell>102</cell> <cell>王五</cell> <cell>男</cell> <cell>22</cell> <cell>028-3693960</cell> </row> <row id="3"> <cell>103</cell> <cell>薛强</cell> <cell>女</cell> <cell>23</cell> <cell>028-2896960</cell> </row> </rows>
数据文件的格式还是很简单的，根标签为<rows>，下面包含多个<row>标签，<row>下面包含多个<cell>标签。其中：
<row> 表示数据表的一行
<cell> 表示数据表的单元格
html和JavaScript源码如下：
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "https://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>dhtmlxGrid测试</title>
<link type="text/css" rel="stylesheet" href="../../js/dhtmlxGrid/dhtmlxgrid.css" />
<link type="text/css" rel="stylesheet" href="../../js/dhtmlxGrid/skins/dhtmlxgrid_dhx_skyblue.css" />
<script type="text/javascript" src="../../js/jquery-1.9.0.min.js"></script>
<script type="text/javascript" src="../../js/dhtmlxGrid/dhtmlxcommon.js"></script>
<script type="text/javascript" src="../../js/dhtmlxGrid/dhtmlxgrid.js"></script>
<script type="text/javascript" src="../../js/dhtmlxGrid/dhtmlxgridcell.js"></script>
<style type="text/css">
a {line-height:25px;color:blue;font-size:14px;}
</style>
</head>
<body>
<h4>
<a href="../../index.jsp">返回主页</a>
<a href="main.jsp">返回页面</a>
</h4>
<div id="gridbox" style="width:600px;height:200px"></div>
<script type="text/javascript">
$(function(){
// 创建dhtmlGrid对象，使用div的id来创建
var mygrid = new dhtmlXGridObject('gridbox');
// 设置表格需要用到的图片路径
mygrid.setImagePath("../../js/dhtmlxGrid/imgs/");
// 设置列名称
mygrid.setHeader("编号,姓名,性别,年龄,联系电话");
// 用像素设置列的宽度
mygrid.setInitWidths("80,150,80,80,*");
// 设置列值的对齐方式
mygrid.setColAlign("center,center,center,center,center");
// 设置列的类型。如：ro为只读（readonly）
mygrid.setColTypes("ro,ro,ro,ro,ro");
// 初始化表格
mygrid.init();
// 设置表格皮肤
mygrid.setSkin("dhx_skyblue");
// 设置表格数据
mygrid.loadXML("./data/data02.xml");
});
</script>
</body>
</html>更多dhtmlxGrid请持续关注本栏目！！^_^
川公网安备51010802032098
