dhtml xgrid 实现前台大数据延迟加载效果

最新推荐文章于 2021-06-17 01:50:48 发布

mememama111

最新推荐文章于 2021-06-17 01:50:48 发布

阅读量278

点赞数

CC 4.0 BY-SA版权

文章标签：大数据

本文链接：https://blog.youkuaiyun.com/mememama111/article/details/84409074

本文介绍dhtmlxGrid通过enableBuffering实现大数据集的高效显示。利用此特性，可以显著减少页面加载时间并改善用户体验，尤其是在处理大量数据时。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
	<title>Smart Rendering</title>
</head>

<body>
<link rel='STYLESHEET' type='text/css' href='../common/style.css'>

	<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxgrid.css">
	<script  src="../../codebase/dhtmlxcommon.js"></script>
	<script  src="../../codebase/dhtmlxgrid.js"></script>
	<script  src="../../codebase/ext/dhtmlxgrid_srnd.js"></script>
	<script  src="../../codebase/dhtmlxgridcell.js"></script>
	<table width="600">
		<tr>
			<td width="50%" valign="top">
				<div id="gridbox" width="100%" height="250px" style="background-color:white;"></div>
			</td>

		</tr>
		<tr>
			<td>
                <div id="a_1"></div>
			</td>
		</tr>
	</table>
<br>

<script>


	mygrid = new dhtmlXGridObject('gridbox');
	mygrid.setImagePath("../../codebase/imgs/");
	mygrid.setHeader("Order,Index 1,Request info");
	mygrid.setInitWidths("50,275,250")
	mygrid.setColAlign("right,left,left")
	mygrid.setColTypes("ed,ed,ed");
	mygrid.setColSorting("int,str,str")
	mygrid.setColumnColor("white,#d5f1ff,#d5f1ff")
	mygrid.init();

	mygrid.enableBuffering(20);
  
    mygrid.loadXML("smartrend.xml");


</script>


</body>
</html>

其中mygrid.loadXML("smartrend.xml");代表的是加载的数据源，