Блог

Главная - Вопросы по программированию - Как добавить класс к элементу body в javascript?

Как добавить класс к элементу body в javascript?

#javascript #dom

#javascript #dom

Вопрос:

Итак, я хотел закодировать простую вещь на javascript, у меня есть отзывчивая панель навигации с кнопкой гамбургера:

 <input type="checkbox" id="check" onclick="validate()">
<label for="check" class="checkbtn">
    <i class="fas fa-bars"></i>
</label>

Я хотел остановить прокрутку всякий раз, когда активно меню гамбургера. Итак, я написал этот код javascript:

 <script type="text/javascript">
function validate() {
    var element = document.getElementByTagName("body")[0];
    if (document.getElementById('check').checked){
        element.classList.add("noscroll");
    }
}

И, конечно, я добавил .noscroll{ overflow: hidden; } в файл css.

По какой-то причине это не сработало, и я надеюсь, что вы, ребята, поможете мне определить.

Комментарии:

1. Добавлен ли класс в тело?

2. Нет, он не добавлен.

3. Когда вы отлаживаете код, у вас всегда должна быть открыта консоль разработчика, чтобы вы могли искать ошибки, выдаваемые браузером. В этом случае ваш код, вероятно, выдает document.getElementByTagName is not a function ошибку, поскольку функция getElementsByTagName . Я бы посоветовал поискать в Интернете «отладку javascript», чтобы добавить в свой набор навыков.

4. Как уже упоминалось, getElementByTagName не существует. Более простой способ получить доступ к телу document.body .

Ответ №1:

Самый короткий ответ, надеюсь, это поможет

 const body = document.body;
body.classList.add("MyClass");

Комментарии:

1. Не document.body.classList.add('MyClass') было бы короче?

2. да, но я был в середине функционального подхода, кстати, тот же результат, а ваш короче