Скрыть элемент по классам в чистом Javascript
Я пробовал следующий код, но не работает. Любая идея, где я пошла не так?
document.getElementsByClassName('appBanner').style.visibility='hidden';
<div class="appBanner">appbanner</div>
Ответы
Ответ 1
document.getElementsByClassName
возвращает HTMLCollection
(объект, подобный массиву) всех элементов, соответствующих имени класса. Свойство style
определено для Element
не для HTMLCollection
. Вы должны получить доступ к первому элементу, используя ноту подписи (подстрочный).
document.getElementsByClassName('appBanner')[0].style.visibility = 'hidden';
Обновлен jsFiddle
Чтобы изменить правила стиля для всех элементов, соответствующих классу, с помощью API Selectors:
[].forEach.call(document.querySelectorAll('.appBanner'), function (el) {
el.style.visibility = 'hidden';
});
Если доступно for...of
:
for (let el of document.querySelectorAll('.appBanner')) el.style.visibility = 'hidden';
Ответ 2
var appBanners = document.getElementsByClassName('appBanner'), i;
for (var i = 0; i < appBanners.length; i ++) {
appBanners[i].style.display = 'none';
}
JSFiddle.
Ответ 3
Array.filter( document.getElementsByClassName('appBanner'), function(elem){ elem.style.visibility = 'hidden'; });
Разветвленный @http://jsfiddle.net/QVJXD/
Ответ 4
<script type="text/javascript">
$(document).ready(function(){
$('.appBanner').fadeOut('slow');
});
</script>
или
<script type="text/javascript">
$(document).ready(function(){
$('.appBanner').hide();
});
</script>