ExtJS中Ext.get()、Ext.fly()方法对比

Ext.get()方法是Ext.dom.Element.get()方法的别名,根据传入的HTML元素的ID、HTML元素本身或Ext.dom.Element本身,获取对应的Ext.dom.Element对象。

除此之外,Ext还提供了系列的getXxx()方法,用于获取HTML页面中特定的元素,方法如下:

getDoc():返回该HTML页面本身包装成的Ext.dom.Element对象。

getHead():返回HTML页面的<head.../>元素对应的Ext.dom.Element对象。

getBody():返回HTML页面的<body.../>元素对应的Ext.dom.Element对象。

Ext.onReady(function() {
	var target = Ext.get('target');
	target.setWidth(200);
	target.setHeight(80);
	target.setStyle('border', '2px solid black');
	
	Ext.getBody().setStyle('background-color', '#FFFFFF');
});

除了Ext.get()方法之外,Ext还提供了一个Ext.fly()方法,二者功能接近,但性能上有差异。程序通过Ext.get()方法来获取元素,每个DOM元素都会生成一个全新的Ext.dom.Element对象,因此频繁的调用Ext.get()方法来获取元素时,会造成大量的内存开销。为了解决内存开销过大的问题,ExtJS采用了Flyweight设计模式(享元模式)。

对于那些即时使用的DOM元素,一般推荐使用Ext.fly()方法来获取,而不是Ext.get()方法,因此上面的程序改成Ext.fly('target')的效果会更好!

本文标题:ExtJS中Ext.get()、Ext.fly()方法对比

本文链接:http://yedward.net/?id=325

本文版权归作者所有,欢迎转载,转载请以文字链接的形式注明文章出处。

相关文章