Динамическое изменение css-классов элементов на странице

Добрый день коллеги! Подскажите пожалуйста, какими способами можно динамически добавлять/удалять css-классы для сгенерированной и отрисованой страницы?
Например, были добавлены следующие дифы для контейнера, и кнопки, которую он будет содержать:

        {
                "operation": "insert",
                "name": "SignButtonsContainer",
                "parentName": "HeaderContainer",
                "propertyName": "items",
                "values": {
                        "itemType": Terrasoft.ViewItemType.CONTAINER,
                        "visible": true,
                        "wrapClass": ["sign-container"],
                        "items": []
                }
        },
        {
                "operation": "insert",
                "parentName": "SignButtonsContainer",
                "propertyName": "items",
                "name": "SignBtnInsurance",
                "values": {
                        "itemType": Terrasoft.ViewItemType.BUTTON,
                        "caption": {"bindTo": "sign_insurance"},
                        "hint": {"bindTo": "Resources.Strings.sign_insurance"},
                        "imageConfig": {"bindTo": "Resources.Images.sign_insurance_image"},
                        classes: {
                                wrapperClass : "sign-btn",
                                imageClass   : "sign-img",
                        },
                        "visible": true
                }
        },

в итоге, для кнопки были сгенерированы стандартные классы: t-btn-wrapper, t-btn, t-btn-style-default и кастомный, описанный в дифе - sign-btn.

Вопрос : как можно динамически (при отрисованной странице) добавить свой кастомный класс, описанный в LESS, или удалить существующий?
Заранее спасибо!

Нравится

9 комментариев

Javascript-ом:
document.getElementById('YourElement').className += ' class_two' //add or anything
или JQuery
$('#YourElement').addClass('class_two'); //add
$('#YourElement').removeClass('class_one'); //remove

Спасибо за оперативный ответ! Подскажите пожалуйста, глобальный объект JQuery всегда доступен, или его надо подключать на страницу специальным образом?

JQuery нужно прописать каждый раз, где он необходим.

Не могли бы Вы сбросить пример подключения на страницу JQuery?

попробуйте просто подключить его в зависимости схемы:
к примеру:

define("LeadPageV2", ["BusinessRuleModule", "jQuery"],
  function(BusinessRuleModule) {

Спасибо!

Подскажите пожалуйста, где посмотреть, какая версия Jquery используется?

В пакете NUI, в самой схеме jQuery посмотрите, там написано.

спасибо!

Показать все комментарии