доступ к CSS переменной.
Такая ситуация.
В каком то прилинкованном css есть Код:
:root {Не изменить (установить) ее через style.setProperty, а именно получить ее. Или хотя бы узнать определена ли такая переменная. |
voraa, ну переменную смотреть надо на каком-то конкретном элементе, т.к. она в каскаде 10 раз поменяться могла. А так - как обычно: getComputedStyle(element).getPropertyValue('--my-var').
|
Спасибо. И действительно.
Я пробовал getComputedStyle(document.documentElement)['--my-var'] не получалось. И в девтулсе смотрел результат getComputedStyle(document.documentElement) - не находил там переменных. |
Как пример.
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><style>
body { --my-var: #FF0000;}
.ss { background-color: var(--my-var);}
</style><script>
function fu (color) { document.styleSheets[0].rules[0].style.cssText = '--my-var: '+ color + ';';} // OR .setProperty
</script></head><body>
<div class="ss">какой то случайный текст</div>
<input type="button" value="Button 1" onclick="fu ('#00FF00')" />
<input type="button" value="Button 2" onclick="fu ('#0000FF')" />
</body></html>
>> Можно ли как то получить к ней доступ из js? Да можно CSS это такая же часть документа как и все остальное в документе. Главное понимать принципы работы браузера по построению страницы они в целом довольно простые В ответ на запросы браузера приходят потоки байтов которые разбивается на 4ре отдельных парсера HTML CSS JS и отдельные объекты (картинки ифреймы музыка и т.д.) В данном случае парсер CSS создает каскадные таблицы стилей которые доступны через объектную модель документа как свойство самого документа "document.styleSheets" где их можно найти и изменить getComputedStyle только делает запрос к уже сформированным таблицам стилей не изменяя их а только возвращая новый объект. |
MallSerg,
ТО, что можно перебрать все таблицы стилей и все правила я знаю, но не хотелось заморачиваться. Нужно было, просто определить, подключен ли файл с такой переменной, определенной для :root или нет. |
| Часовой пояс GMT +3, время: 03:06. |