/ ↲
    Расширенный поиск

    JavaScript

    .removeProperty()

    Удаляем CSS-свойство у элемента.

    Время чтения: меньше 5 мин

    Это незавершённая статья. Вы можете помочь её закончить! Почитайте о том, как контрибьютить в Доку.

    Кратко

    Скопировано

    Метод removeProperty() удаляет указанное CSS-свойство у элемента и возвращает значение этого свойства.

    Пример

    Скопировано
    Открыть демо в новой вкладке

    Превращаем круг в квадрат.

            
          
          const circle = document.getElementById('round')function turnToSquare () {  circle.style.removeProperty('border-radius')}
          const circle = document.getElementById('round')

function turnToSquare () {
  circle.style.removeProperty('border-radius')
}

    Как пишется

    Скопировано

    removeProperty() принимает один аргумент — строку с именем свойства. Пишем названия так же, как в CSS: background-color, а не backgroundColor.

            
          
          vampire.style.removeProperty('box-shadow')
          vampire.style.removeProperty('box-shadow')

    Как понять

    Скопировано

    Метод removeProperty() удаляет отдельное CSS-свойство элемента.

    Чтобы управлять отображением элемента, лучше использовать чистый CSS, устанавливая элементу классы-модификаторы с нужным набором стилей.

    Иногда полезно программно изменять CSS-свойства. Например, если в нужный момент установить элементу свойство will-change, а потом удалить его, то можно получить выигрыш по производительности.

    Если с помощью метода removeProperty() не выходит удалить свойство, и вы получаете ошибку NoModificationAllowedError, значит элемент или его свойство находится в режиме read-only.

    Есть альтернатива — можно использовать style и указать свойству значение null. Названия в этом случае пишем через camelCase:

            
          
          vampire.style.boxShadow = null
          vampire.style.boxShadow = null

    Читайте также