Всё начинается со всего. Звездочка позволяет получить все элементы структуры.

*

Теперь получим все экземпляры конкретного элемента.

div

Сразу введём возможность совершать операции над экземпляром (обработка событий, манипуляции стилями и т.п.) Работает как функция map в Питоне.

div.func(params)

Запросим все div`ы, которые имеют индекс 5 в списке своих братьев.

div(5)

Условия становятся жёстче. Отбор элементов по атрибутам.

div(3, class="cl", attr=5)

Почему у атрибута не может быть несколько подходящих нам значений?

div(3, class=("cl", "cl2), attr=5)

Пора двигаться. Просим все div`ы у родителя body

body->div

Проходим сквозь толщу поколений.

body->div->p

Разумеется, в любой момент цепочки мы вправе ставить дополнительные условия отбора, например, по атрибутам.

body->div(params)->p

Нет, здесь мы не ищем экземпляры p у родителя div. Обращение идёт к div, у которого в детях значится некий p.

p<-div

p<-div<-div(class="one")

Здесь мы требуем p, у которого в детях есть a. А всё это хозяйство завернуто в div.

div->a<-p

Праздник безумия продолжается! Ищем p, который ребенок div`а, имеет брата "a", и деда el. WTF?

el->a<-div->p

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

div(class!="cl")

Подобно математическим множествам, можно удалить из множества нужный элемент символом ''. Команда вернет всё, кроме div, атрибуты которого удовлетворяют params.

*\div(params)

Очень похожа на предыдущую, едва различима. Команда вернет всё, что НЕ содержит div, атрибуты которого удовлетворяют params.

*|div(params)

Почему мы ищем экземпляры только одного класса? Скобки позволяют сделать множественную выборку по нескольким элементам. Команда вернет все b внутри div и p.

(div, p)->b

Вернёт все b у которых родители div и p, но вернуться только те 'p', что не содержат внутри img.

(div(params), p(params)|img)->b

Выборки повсюду. Выберем не только b, но и i, родители которых зовутся не иначе как div, и p.

(div(params), p(params))->(b, i)

Подобно математическим неравенствам, при умножении на -1, все переворачивается, а знак меняется. Теперь мы обращаемся к div и p, у которых есть дети b и i.

(b, i)<-(div(params), p(params))

Навешиваем событие. Спойлер: пожоже, понадобятся функции, дабы не было путаницы.

div.event(func)

def func(element):
	element->*.setstyle()

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

include("file.js")

Ещё пример напоследок:

body->div(id='container')|p(class="wow")|(a(a="v", r=("t", "r")), p(0)<-figure)->*

Впихнуть невпихуемое :D

Если дочитал до этого места, теперь ты тоже шизик. Поставь лайк этой статье, жми на колокольчик, санитары уже едут.