как скрыть элемент в js

Question

Aleksey · Accepted Answer

Есть несколько способов _скрыть_ элемент на js, основанные на применении стилей. Например, можем задать определенное CSS-правило для атрибута `style` самого элемента:

1. Используя `display: none`
2. Используя `visibility: hidden`

Оба эти способа скрывают элемент, но разница в том, что элемент, скрытый с помощью `display: none`, не занимает места на странице, в отличие от `visibility: hidden`.

Рассмотрим вариант применения этих стилей, но с использованием имен CSS-классов и методов `classList.add()`, `classList.remove()` для их добавления и удаления. Создадим класс с именем hidden, который содержит свойства для скрытия элемента:

```css
.hidden {
  display: none;
}
```

Затем, чтобы скрыть элемент с помощью этого класса, добавим его к элементу:

```javascript
document.getElementById('myElement').classList.add('hidden');
```

Чтобы показать элемент снова, удалим класс:

```javascript
document.getElementById('myElement').classList.remove('hidden');
```

Такой подход может быть более гибким и удобным в использовании, особенно если вы работаете с множеством элементов на странице.

как скрыть элемент в js

Ответы

Каталог