От простого к сложному. Реализация логики CSS3-селекторов. Технологии будущего. Оптимизация структуры веб-страниц
Примеры вызовов
Еще один велосипед
Выборка CSS-селекторов
От простого к сложному
Перебор массива
Уникальность элементов
Подводя черту
Но давайте рассмотрим, как решена общая задача по разбору CSS-селекторов. Если принять во внимание, что селектор может быть задан в виде p a.link, form input[type=radio], то логику его разбора можно схематично записать в виде:
Выбираем последовательности селекторов, которые находятся между запятыми. Далее работаем с каждой последовательностью в отдельности. На выходе все последовательности объединяем в итоговый массив (sets).
В последовательности селекторов у нас есть набор элементарных селекторов, которые «вложены» друг в друга (для нашего примера это p a.link). Нам нужно разбить последовательность на части и разобрать каждую такую часть, учитывая, что родительскими элементами для следующей части будут выбранные элементы из предыдущей. За «превращение» дочерних узлов в родительские (прямо процесс взросления получается) отвечает массив nodes.
Каждый элементарный элемент уже придется разбирать с помощью регулярного выражения, чтобы вычленить части, отвечающие за идентификатор, класс и модификаторы CSS 2/3. Разбирать быстрее всего при помощи exec, а потом записывать в переменные части полученного массива:
single = regexp.exec(single);
tag = single[1];
id = single[2];
...
И наконец, третий цикл проходится по всем родительским элементам и пытается выбрать из них дочерние узлы, соответствующие заданным в CSS-селекторе параметрам.
Как мы видим, основная логика данной задачи включает, как минимум, одно регулярное выражение (использование indexOf и substring будет при такой сложности намного более ресурсоемко) и 3 цикла (которые нужно сделать максимально быстрыми). Не стоит перечислять все возможности быстрого выбора элементов, просто сделаем акцент на некоторых аспектах.