!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");代表的是加载的数据源,
<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>
这些是必须要引入的dhtml的js文件,
mygrid.enableBuffering(20);最关键的就是该行js
当我们设置了enableBuffering属性的时候,20代表的是当我们显示数据的时候默认第一次加载
的时候显示的是20条记录,如果设置为50第一次加载的时候显示50条记录
当我们设置enableBuffering(50);为50时,滑动条变小了。
不管我们设置的是20,还是50,当我们往下拖动滑动条的时候,其他需要显示的数据会随着我们拖动而逐渐在页面的表格中显示。
dhtmlxgrid帮我们解决了,大数据在前台显示的时候造成前台页面假死的状态,提高了数据的显示效率,因为在不使用延迟加载的时候,
可能10000条数据的显示需要40秒左右,但是设置了enableBuffering属性,我们可以先预先设置30条或者50条数据在第一次加载的时候
显示出来,其他的数据当用户真正需要的时候,也就是拖动滑动条的时候显示出来,这样即增加了页面的友好性,又缩短了数据显示的等待
时间。
相关推荐
DHTML 中文 手册 chm格式 ,做前台人员必备
强大的javascript控件,树形控件,布局控件,表格控件,菜单控件,强大的ajax运用。
动态HTML效果和源代码,大部分是图片的效果
DHTML 手册 DHTML 手册 DHTML 手册 DHTML 手册
一个高效的基于DHTML实现DMenu, DHTML Menu菜单程序。
基于DHTML+AJAX实现的Menu类库scripts代码例子。
一个非常漂亮的基于DHTML+ajax实现的标签导航类库代码。
DHTML手册 DHTML
DHTML技术资料 DHTML的概念 DHTML 技术的核心—DOM CSS-P DHTML 编程
Dhtml手册(Dhtml手册.chm)
一个基于DHTML+js实现的image-slideshow图片展示类库源码例子。
DHTML 完全手册 动态 HTML (DHTML) 对象模型参考 <br>DHTML 对象 DHTML 属性 DHTML 方法 DHTML 事件 DHTML 集合 HTML 参考 <br>HTML 元素 HTML 字符集 样式表(CSS)参考 <br...
DHTML 对象 DHTML 属性 DHTML 方法 DHTML 事件 DHTML 集合 HTML 参考 HTML 元素 HTML 字符集 样式表(CSS)参考 CSS 属性参考 CSS 长度单位参考 其他参考 命令标识符 缺省行为参考 htc 行为参考 可视化...
DHTML电子书 DHTML电子书 DHTML电子书 DHTML电子书DHTML电子书 DHTML电子书
DHTML 对象 DHTML 属性 DHTML 方法 DHTML 事件 DHTML 集合 HTML 参考 HTML 元素 HTML 字符集 样式表(CSS)参考 CSS 属性参考 CSS 长度单位参考 其他参考 命令标识符 缺省行为参考 htc 行为参考 可视化...
DHTML 手册 DHTML
DHTML 指动态 HTML(Dynamic HTML)。 DHTML 不是由万维网联盟(W3C)规定的标准。 DHTML 是一种用来创建动态... 可视滤镜(允许您向文本和图形应用可视效果) 动态 CSS(允许您控制元素的定位和可见性)
DHTML 不是由万维网联盟(W3C)规定的标准。DHTML 是一个营销术语 - 被网景公司(Netscape)和微软公司用来描述 4.x 代浏览器应当支持的新技术。 DHTML 是一种用来创建动态站点的技术组合物。对大多数人来说,DHTML ...
Java大数据培训学校全套教程:"java大数据培训学校全套教材"系列课程由750集视频构成,基本就 是1)...本门课程为"java大数据培训学校全套教材"系列课程的第二十五篇,学习DHTML等概念让大家对DHTML编程打下好的基础。