Проблема проверки, является ли элемент «активным» в JavaScript - PullRequest
Новая
       18

Проблема проверки, является ли элемент «активным» в JavaScript

0 голосов
/ 09 октября 2019

У меня есть боковая панель, и я хочу использовать JavaScript, чтобы проверить, когда она «активна». Вот мой код: 

    #sidebar {
    background: #202020;
    color: #fff;
    display:inline-block;   
    }

    #sidebar.active {
    margin-left: -250px;
    } 

//Check to see whether sidebar has class 'active'
var sideBar = document.getElementById('sidebar')
        console.log(sideBar.className)
        if (sideBar.className == ('active')){
                console.log('active')
            }
        else (console.log('not active'))

Однако этот код не является console.logging ничего, и поэтому он читает "неактивно", даже когда боковая панель явно активирована. Что я делаю неправильно? Спасибо.

enter image description here

1 Ответ

0 голосов
/ 09 октября 2019

Проблема, которую вы наблюдаете, вероятно, потому что вы сравниваете sidebar.className == ('active') напрямую. Атрибут className является строковым объектом, который содержит имена всех примененных к нему классов. Во многих случаях автоматически добавляются дополнительные классы (из разных библиотек), поэтому проверка, совпадает ли она с одним именем класса, часто не даст желаемого результата.

Атрибут classList является DOMTokenList и может более надежно использоваться для задач такого типа. Таким образом, для этого варианта использования вы можете попробовать использовать sidebar.classList.contains('active').

т.е. 

var sideBar = document.getElementById('sidebar');
console.log(sideBar.className)
if (sideBar.classList.contains('active')){
    console.log('active')
}
else (console.log('not active'))
...