Как сделать DIV видимым и невидимым с помощью JavaScript

Question

Как сделать DIV видимым и невидимым с помощью JavaScript

вы можете сделать что-то вроде

function showDiv()

{

    [DIV].visible = true;

    //or something

}

Извините, если это девка.

3271 5

javascript html

5 ответов:

Comments

Ничего не найдено.

ron tornambe · Accepted Answer · 2012-02-26 21:21:53

Если [DIV] является элементом, то
[DIV].style.visibility='visible'
или
[DIV].style.visibility='hidden' 

ThiefMaster · Accepted Answer · 2017-01-18 01:14:16

предположим, что вы не используете библиотеку, такую как jQuery.

если у вас еще нет ссылки на элемент DOM, получите его с помощью var elem = document.getElementById('id');

затем вы можете установить любое свойство CSS этого элемента. Чтобы показать / скрыть, вы можете использовать два свойства:display и visibility, которые имеют несколько разные эффекты:

настройка style.display будет выглядеть так, как будто элемента нет вообще ("удалено").
elem.style.display = 'none'; // hide
elem.style.display = 'block'; // show - use this for block elements (div, p)
elem.style.display = 'inline'; // show - use this for inline elements (span, a)
или style.visibility будет на самом деле сделать div все еще там, но будет "все пусто"или" все белое"
elem.style.visibility = 'hidden'; // hide, but lets the element keep its size
elem.style.visibility = 'visible';
если вы используете jQuery, вы можете сделать это еще проще, пока вы хотите установить display свойства:
$(elem).hide();
$(elem).show();
он будет автоматически использовать соответствующие display значение; вам не нужно заботиться о типе элемента (встроенного или блока). Кроме того, elem может быть не только элементом DOM, но и селектором, таким как #id или .class или что-нибудь еще, что является допустимым CSS3 (и еще!).

zellio · Accepted Answer · 2012-08-27 14:23:20

можно использовать visibility или display но вы должны применить изменения к

jarh1992 · Accepted Answer · 2018-08-10 00:18:54

вы можете использовать функции DOM: setAttribute и removeAttribute. В следующей ссылке у вас есть пример того, как их использовать.

setAttribute и removeAttribute функции

быстрый взгляд:
hide:    document.getElementById("myDiv").setAttribute("hidden","");
unhide:  document.getElementById("myDiv").removeAttribute("hidden");

Kamil Kiełczewski · Accepted Answer · 2018-07-01 20:20:11

код showDiv() функция может выглядеть следующим образом (я меняю его имя на более универсальный):
function show(element, hide = false) {
    element.style.visibility = hide ? 'hidden' : 'visible';    
}
и использовать его следующим образом (файл ".test" должен быть действительным селектор CSS для вашего DIV)
let div = document.querySelector(".test");
show(div, true);
здесь пример работающего.