2017-01-01 3 views
1

Я смог редактировать переменные CSS с document.documentElement.style.setProperty("--text-color", "#333"), однако, я не смог воспроизвести это с помощью jQuery, прототип .css(), похоже, работает с известными свойствами CSS.Каков самый простой способ редактировать переменные CSS с помощью jQuery?

Вот пример CSS для указанной выше переменной CSS.

:root { 
    --text-color: #888; 
} 

div { 
    color: var(--text-color); 
} 
+0

$ ("element"). Css ("color", "# 888") – Bindrid

+1

@Bindrid Переменные CSS, а не общий CSS. https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_variables – sparcut

+0

О, вы пытались исправить их как атрибут? – Bindrid

ответ

6

По состоянию на 16 марта 2017 года, поддержка пользовательских свойств был погружен в jQuery 3.2.0 and later. Планируется не поддерживать эту функциональность до 2.x или более ранних версий, поэтому, если вам нужно использовать более старую версию jQuery по причинам обслуживания, вам нужно будет продолжать использовать встроенный объект style для доступа к вашим пользовательским свойствам.


jQuery пока не поддерживает свои свойства. Существует pull request, который еще не рассмотрен (но на основе последних комментариев, по-видимому, намечена ближайшая версия). Приоритет не настолько высок, поскольку пользовательские свойства по-прежнему являются довольно новой функцией, и их природа заставляет как разрабатывать оболочку для браузеров, поддерживающих их изначально, так и повторно внедряя их в JavaScript для браузеров, которые этого не делают, и тестирование функции чтобы убедиться, что все работает, не нарушая другие функции jQuery, а также существующие сайты, довольно сложная задача.