ExtJS DOM Установка стилей, классов и атрибутов

Приведем примеры методов установки в ExtJS стилей, классов и атрибутов.

Ext.onReady(function(){
    var ex1=Ext.select('#ex1');
    ex1.setStyle({'border':'5px solid red'}); // установить стиль
    ex1.setHeight(50); // установить высоту
    ex1.setWidth(150); // установить ширину
    ex1.setOpacity(.25); // установить прозрасность
    ex1.addCls('red'); // добавить CSS-класс
    ex1.removeCls('red'); // удалить CSS-класс
    ex1.set({title:'set title'}) // установить аттрибут
});

В результате выполнения кода ExtJS изменит оформление данного элемента.



Эти методы работают как с Ext.Element так и c Ext.CompositeElement, то есть первую строку можно свободно заменить на:

var ex1=Ext.get('ex1');

Чтение стилей, классов, атрибутов.

var ex2=Ext.get('ex2');
var s= 'width:'+ex2.getWidth() // считать ширину
+ '; height:'+ex2.getHeight() // считать высоту
+ '; id:'+ex2.getAttribute('id') // определить атрибут ID
+ '; hasCls:'+ex2.hasCls('red'); // определить наличие класса
ex2.createChild(' '+s+''); // вывод результата в #ex2;