Как сделать переключатель 'открыть' и 'закрыть'?

Question

[DimaD0106d]

<div class="container-activatedOptions">
		<form class="form-activatedOptions">
			<button class="activatedOptions">Открыть настройки</button>
		</form>
	</div>

let options = document.querySelector('.options')

let activatedOptions = document.querySelector('.activatedOptions')

activatedOptions.onclick = function(){
	if(options.style.display == 'none'){
		options.style.display = 'block'
		activatedOptions.innerHTML = 'Закрыть настройки'
		return false
	}
	else if(options.style.display == 'block'){
		options.style.display = 'none'
		activatedOptions.innerHTML = 'Открыть настройки'
		return false
	}
}

Почему не срабатывает?

Answer 1

[DimaD0106d]

УРАА, ПОЛУЧИЛОСЬ, ПРОСТО НАДО БЫЛО УКАЗАТЬ В JS ЧТО options.style.display = 'none'

Comments

[FrelFrloich]

Вот так пробни, в css укажи дисплей ноне, если оно должно быть первоначально скрыто.

let options = document.querySelector('.options')
let activatedOptions = document.querySelector('.activatedOptions')
let textOptions = activatedOptions.textContent

activatedOptions.onclick = function () {
    textOptions.textContent = textOptions.textContent === 'Закрыть настройки' ? textOptions :  'Закрыть настройки'
    activatedOptions.classList.toggle('options--show')
}