.. / 12.1 ExtJS — манипуляции с узлами DOM. Установка/чтение стилей, классов, атрибутов

  1. ExtJS-4

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

Ниже приведу некоторые из методов для установки стилей, классов и атрибутов

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'}) // установить аттрибут !!! не setAttribute(), что более логично
});

#ex1.green

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

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

А вот с чтением аттрибутов уже не так. Читать можно только у конкретного элемента.

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

Ниже приведу некоторые из методов для чтения стилей, классов и атрибутов

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;

#ex2:

Далее

  1. Манипуляции с DOM. Часть 2. Добавление/удаление и пр. операции с узлами
  1. 2011-12-11
  2. ExtJS-4
  1. sencha.com DomQuery v1.1 Basics - http://www.sencha.com/learn/domquery-v11-basics/
Go Index Test