JavaScript. Подробное руководство, 6-е издание, Флэнаган Дэвид

JavaScript. Подробное руководство, 6-е издание

на обложку

Флэнаган Дэвид

Шрифт:

* имеет встроенную поддержку в броузере, функция возвращает объект, подобный массиву,

* который имеет свойство length и поддерживает возможность индексирования массива.

* Имитация объекта DOMTokenList не подобна массиву, но имеет метод toArray.

* который возвращает истинный массив имен классов элемента.

function classList(e) {

if (е.classList) return e.classList; // Вернуть e.classList, если имеется

else return new CSSClassList(e); // Иначе попытаться подделать его

}

// CSSClassList - класс JavaScript, имитирующий объект DOMTokenList

function CSSClassList(e) { this.e = e; }

// Возвращает true, если e.className содержит класс с, иначе - false

CSSClassList.prototype.contains = function(c) {

// Проверить, является ли с допустимым именем класса

if (с.length === 0 || c.indexOf(" ") != -1)

throw new Error("Недопустимое имя класса: + с + .....);

// Сначала проверить общие случаи

var classes = this.e.className;

if (!classes) return false; // e вообще не имеет классов

if (classes === c) return true; // e имеет единственный класс,

// имя которого точно совпадает с искомым

// Иначе использовать RegExp для поиска с как отдельного слова

// \b - в регулярных выражениях соответствует границе слова,

return classes.search(”\\b" + с + "\\b") != -1;

};

// Добавляет имя класса с в е.className, если оно отсутствует в списке

CSSClassList.prototype.add = function(c) {

if (this.contains(c)) return; // Ничего не делать, если имя уже в списке

var classes = this.e.className;

if (classes && classes[classes.length-1] != " ")

c = " " + с; // Добавить пробел, если необходим

this.е.className += с; // Добавить имя с в className

};

// Удаляет все вхождения с из е.className

CSSClassList.prototype.remove = function(c) {

// Убедиться, что с - допустимое имя класса

if (с.length === 0 || c.indexOf(" ") != -1)

throw new Error("Недопустимое имя класса: + с + .....);

// Удалить все вхождения имени с как слова и все завершающие пробелы

var pattern = new RegExp("\\b" + с + '\\b\\s*'\ "g");

this.e.className = this.e.className.replace(pattern, "");

};

// Добавляет имя с в e.className, если оно отсутствует в списке, и возвращает true.

// Иначе удаляет все вхождения имени с из e.className и возвращает false.

CSSClassList.prototype.toggle = function(c) {

if (this.contains(c)) { // Если e.className содержит c

this.remove(c); // удалить его.

return false;

}

else { // Иначе:

this.add(c); // добавить его.

return true;

}

};

// Возвращает само значение e.className

CSSClassList.prototype.toString = function { return this.e.className; };

// Возвращает имена из e.className

CSSClassList.prototype.toArray = function {

return this.e.className.match(/\b\w+\b/g) || [];

};

16.6. Управление таблицами стилей

До сих пор мы видели, как устанавливать и получать значения CSS-свойств стиля и классы отдельных элементов. Однако существует еще возможность управления самими таблицами стилей CSS. Обычно в этом не возникает необходимости, тем не менее такая возможность иногда бывает полезной, и в этом разделе коротко будут представленные возможные приемы.