Прежде всего, объект CompositeElementLite поддерживает все методы объекта Element, предназначенные для управления привязкой стилевых классов, атрибутами

тега и стиля, привязкой обработчиков событий и т. п. Так что мы можем привязывать стилевые классы и обработчики событий сразу к нескольким элементам Web-страницы. (Собственно, мы это уже делали.)

Метод getCount возвращает число элементов данной коллекции. Он не принимает параметров:

var i = clContainers.getCount;

В переменной i окажется число элементов в полученной ранее коллекции

clContainers — 5.

Метод item возвращает элемент данной коллекции с указанным индексом в виде экземпляра объекта Element:

<экземпляр объекта CompositeElementLite>.item(<индекс>)

Как видим, этот метод принимает единственный параметр — индекс требуемого элемента коллекции в виде числа.

Пример:

var elDiv = clContainers.item(i — 1);

В переменной elDiv окажется последний элемент коллекции clContainers. Поскольку элементы коллекции, как и элементы обычного массива, нумеруются, начиная с нуля, мы передали методу item значение, на единицу меньшее, чем число элементов в коллекции.

А в следующем примере мы последовательно извлекаем все элементы коллекции clContainers и выполняем над ними какие-то действия:

for(var k = 0; k < i; k++) {

var elDiv = clContainers.item(k);

// Что-то делаем

}

Метод indexOf возвращает индекс указанного элемента в данной коллекции в виде числа:

<экземпляр объекта CompositeElementLite>.indexOf(<элемент>)

Единственным параметром этому методу передается искомый элемент. Им может быть строка с именем элемента, экземпляр объекта Element или HTMLElement.

Если переданный элемент в коллекции отсутствует, метод indexOf возвращает –1.

Пример:

var ind = clContainers.indexOf("cnavbar");

В переменной ind окажется индекс контейнера cnavbar в коллекции clContainers — 1.

Метод each вызывает для каждого элемента данной коллекции указанную функцию:

<экземпляр объекта CompositeElementLite>.each(<функция>)

Единственным параметром этому методу передается функция, которая будет вызвана для каждого элемента данной коллекции. Она должна принимать следующие параметры:

— элемент коллекции в виде экземпляра объекта Element;

— сама эта коллекция в виде экземпляра объекта CompositeElementLite;

— индекс элемента коллекции в виде числа.

Кроме того, элемент коллекции доступен в теле этой функции через переменную this.

В примере из листинга 15.8 мы привязываем к каждому контейнеру, входящему в коллекцию clContainers, стилевой класс hovered.

Еще проще написать так:

clContainers.addClass("hovered");

На этом мы пока закончим с библиотекой Ext Core. В следующих главах мы к ней еще вернемся и рассмотрим другие ее возможности.

Как видим, библиотека Ext Core позволяет сделать очень многое, написав несколько строчек JavaScript-кода. Если бы мы пользовались для этого исключительно объектами Web-обозревателя, объем кода вырос бы на порядок — не меньше.

Но с помощью Ext Core мы можем сделать не все. Некоторые вещи доступны только через объекты Web-обозревателя.

Один из таких объектов — HTMLDocument, представляющий Web-страницу. Единственный его экземпляр, представляющий текущую Web-страницу, доступен через переменную document. Это мы уже знаем.

Из всех свойств объекта HTMLDocument интерес для нас представляют немногие. Его методы и события нам вряд ли пригодятся.

Свойство title хранит текст заголовка Web-страницы (содержимое тега <TITLE>) в виде строки. Заголовок, как мы помним из главы 1, выводится в строке заголовка окна Web-обозревателя, в котором открыта данная Web-страница.

Пример:

var sTitle = document.title;

В переменной sTitle окажется строка с текстом заголовка Web-страницы. А в следующем примере мы задаем для Web-страницы новый заголовок: document.title = "Заголовок";