EXTjs通过autoLoad加载页面与IFRAME嵌入页面的区别

时间:2021-12-02 14:36:56

最近项目要用ExtJs4.0,首页框架点击菜单要动态加载响应页面,在网上找了一些资料,发现有两种方式实现,一种是通过autoload加载页面,一种是在iframe中通过url请求响应页面,可以说这两种方法各有优点,但我比较倾向与通过autoload的方式来加载。

这两种方法的实现如下:

iframe方法:

在显示区域的html后跟一个iframe。html:' <iframe scrolling="auto" frameborder="0" width="100%" height="100%" src="'+url+'"> </iframe>'。

那个url是传过来的连接,可以是一个页面也可以是一条参数,如a.jsp或者user.do?o=toList,这样就可以直接把你要的页面加载进来,而且你对加载进来的页面进行操作是不是更新整个页面的,而只是更新你加载进来的页面。

通过 <iframe>这个元素加载网页进来的好处是比较方便操作,也比较容易理解,而且可以自己通过样式文件控制响应页面的样式。但这种方式有一个很大的缺点就是每次请求都要重新载入ext-all.js这个文件,这样就大大增加了相应事件,ExtJs的速度本来就饱受诟病,如果再用这种方式来请求速度就会收到很大影响。

autoload方法:

autoload{url:aimUrl,scripts:true}

这种方式请求的好处是不用每次请求一个页面都载入一次ext-all.js,而是在加载首页的时候引入ext-all.js之后就不需要再加载该文件,这样就大大降低了系统开销,提升了响应速度,因此我比较推荐使用这种方式来加载响应页面。但是需要注意用autoLoad加载页面后,被加载的页面和原来页面上的变量会冲突,即两个页面如果变量命名一样的话,后面的会把前面的替代。

以上只是自己最近学习的一点心得,水平有限,理解不一定正确,欢迎大家一起讨论。