Какие алгоритмы и инструменты я должен использовать, чтобы создать калькулятор специфичности CSS?

Я думаю о создании функции, которая вычисляет Специфичность CSS, что довольно простой расчет. В основном, каждый случай #somestring стоит 100каждый случай .somestring или же :somestring стоит 10 и каждый случай somestring стоит 1,

Примеры:

"#mydiv p" —> 101

"ul>li>a" —> 3

"div.pull-right img" -> 12

"body#homepage #home-side-box div.row.pull-left[name="thisrow"]:after" -> 232

Так что функция будет что-то вроде

unsigned long specificity ( const std::string & slctr )
{
// ....
}

Я не ожидаю, что это будет простая реализация, поскольку я понимаю, что в этом есть ряд нюансов, но мне интересно, может ли кто-нибудь дать мне несколько советов по поводу алгоритмов и инструментов, которые я должен использовать для сделать что-то эффективное и чистое. Например, я предполагаю, что я должен использовать std::regex_iterator — это правильно?

2

Решение

Специфика селектора на самом деле не число. Вы не можете сравнить различные типы специфичности друг с другом, как если бы они были целыми числами.

В вашем примере, когда вы назначаете 10 для класса и 1 для имени тега, это будет означать, что, если селектор содержит более 10 имен тегов, он будет иметь большую специфичность, чем тот, который имеет только класс. Но это не так, как это работает.

Если вы абсолютно настаиваете на возврате одного значения, вы можете использовать очень большие различия, скажем, 212 для класса и 224 для удостоверения личности. Тогда алгоритм будет работать только на селекторах с более чем 4096 именами тегов.

Однако правильный подход заключается не в том, чтобы пытаться вычислить одно значение, а в том, чтобы создать функцию, которая сравнивает два селектора. Если один селектор содержит больше идентификаторов, чем другой, его специфичность самая высокая; вернуть «один». Если количество идентификаторов одинаково, сравните количество классов. И так до тех пор, пока вы не найдете разницу, иначе вы не вернете «равно».

1

Другие решения