ExtJS. Изменение элементов DOM (манипуляция)

В данном посте посмотрим как можно манипулировать данными — получать innerHTML, изменять его, работать со стилями и так далее. Также узнаем как менять местами HTML элементы. Для примера возьмем вот такую HTML разметку.


Как получить / изменить innerHTML?

Через Ext.get()

Через Ext.query()

Через Ext.select()


Как получить изменить атрибуты HTML элементов?

Здесь я рассмотрю только на примере метода Ext.get(); Для остальных методов Ext.select(), Ext.query(), Ext.fly() — по аналогии.

Здесь надо отметить, что есть также метод getAttributes( ) — возвращает объект элементов {key:value}, более подробно с ним можно познакомиться в документации.


Как изменить стиль HTML элементов?

Метод setStyle

Метод applyStyles — аналогичен

В принципе, основные моменты мы рассмотрели — остальные методы хорошо описаны в документации.


Как поменять местами HTML элементы?

Интересный пример из интернета (демонстрация insertBefore)