Изменение отступов в css через Js

Question

Изменение отступов в css через Js

Anii Знаток (448), на голосовании 1 год назад

Я учусь писать сайты и столкнулась с проблемой, мне нужно что бы по нажатию ссылки появлялся текст(решение этого я уже нашла) и менялись отступы некоторых элементов.
document.getElementById('one').style= marginTop '100px';
эта функция конечно работает, но у меня есть элементы уже с установленными величинами и мне нужно как-то изменять их плюс 100 минус 100.
никак не могу найти решение.
Заранее спасибо за ответ.

Дополнен 1 год назад

я в Js очень слабо ориентируюсь, буду признательна если напишете еще и объяснение

Answer 1

Сначала получаешь текущее значение отступов с помощью такой записи...

 const element = document.getElementById('one');
const elem_mt = parseInt(getComputedStyle(element).marginTop);

После просто прибавляешь новое значение к существующему и используешь style.

 element.style.marginTop = elem_mt + 100 + 'px';

getComputedStyle() - позволяет получить стили элементов... вообще, это легко заменить на element.style.marginTop, но я такой подход считаю неудобным.

parseInt() - преобразовывает запись формата 100px в обычное число... можно и с помощью substring обрезать, но... зачем.