@Winrous

Как сохранённые стили в localStorage применять к разметке и чтобы после перезагрузки страницы они сохранялись?

Есть две функции повещенные на кнопки , одна прячет слова на русском ,другая на английском,
то есть меняет с display:table-cell на display: none, сделал то чтобы эти значения сохранялись в localStorage, но когда обновляю страницу, в localStorage, остаётся значение, но сами стили не сохраняются на странице.

5f327179cd42a922613107.png

btnHideRusWords.addEventListener('click', () => {
    if(words.length > 0) {
        let layoutEngWords = document.querySelectorAll('.russian-word').forEach(item => {
            item.style.display === 'none' ? item.style.display ='table-cell' : item.style.display ='none'
            localStorage.setItem('hideRusWord', JSON.stringify(item.style.display))
            if (localStorage.getItem('hideRusWord') === 'none' ) {
                item.style.display = localStorage.getItem(JSON.parse('hideRusWord'))
            } else if(localStorage.getItem('hideRusWord') === 'table-cell') {
                item.style.display = localStorage.getItem(JSON.parse('hideRusWord'))
            }
        })
    }
})

btnHideEngWords.addEventListener('click', () => {
    if(words.length > 0) {
        let layoutRusWords = document.querySelectorAll('.english-word').forEach(item => {
            item.style.display === 'none' ? item.style.display ='table-cell' : item.style.display ='none'
            localStorage.setItem('hideEngWord', JSON.stringify(item.style.display))
            if (localStorage.getItem('hideEngWord') === 'none' ) {
                item.style.display = localStorage.getItem(JSON.parse('hideEngWord'))
            } else if(localStorage.getItem('hideEngWord') === 'table-cell') {
                item.style.display = localStorage.getItem(JSON.parse('hideEngWord'))
            }
        })
    }
})
  • Вопрос задан
  • 107 просмотров
Пригласить эксперта
Ответы на вопрос 1
Kozack
@Kozack Куратор тега JavaScript
Thinking about a11y
Вы должны прятать/показывать слова не только по клику, но и устанавливать начальное состояние сразу после загрузки страницы
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы