0

Всем привет, собственно нужна ваша помощь, что имеется:

<span class="header__favorites-count msFavoriter">1</span>

Пытаюсь изобразить такое - если значение в спане 0, то его скрывать, если больше то показывать.

let block_array = document.querySelectorAll(".msFavoriter");
for (let i = 0; i < block_array.length; i++) {
  let value = block_array.innerHTML;
  value <= 0 || isNaN(value) ? block_array[i].classList.add("none") : block_array[i].classList.remove("none");
}

При том, что сейчас есть, класс висит постоянно. Как заставить работать ? Заранее спасибо!

2 ответа 2

1

Превращая пустую строку в число, получаете 0. Поэтому переменная isEmpty будет true только если текст элемента - "0" или пустая строка.

let span = document.querySelectorAll(".msFavoriter");
for (let i = 0; i < span.length; i++) {
  let isEmpty = Number( span[i].textContent ) === 0;
  span[i].classList[ isEmpty ? "add" : "remove" ]("hidden");
}
span { border: 1px solid red; padding: 5px; margin: 5px; }

.hidden { display: none; }
<span class="msFavoriter">1</span>
<span class="msFavoriter">0</span>
<span class="msFavoriter">2</span>
<span class="msFavoriter">0</span>
<span class="msFavoriter">3</span>
<span class="msFavoriter"></span>
<span class="msFavoriter">Moo</span>

P.s. Из контекста вопроса не совсем понятно: Если значения блоков будут меняться в течение времени, эту проверку нужно перенести в ту функцию, из-за которой происходят изменения. Чтобы заодно проверяла значение и меняла состояние блока. В текущем варианте скрипт отработает один раз, в момент загрузки страницы.

1
  • Да прошу прощения, что не уточнил. Значения блоков будут меняться в течении времени, и состояние блока должно меняться без перезагрузки страницы. 17 июн 2020 в 14:18
0
let div = document.getElementById('fav')

let span = document.getElementById('spn').innerText;
span < 1 ? div.style.display = 'none' : div.style.display = 'block'
3
  • добавьте описание вашего кода
    – user243545
    17 июн 2020 в 13:23
  • Пытаюсь найти все элементы с классом .msFavoriter, и если в них числовое значение меньше 0, то добавляю к каждому класс none, если числовое значение меняется в положительную сторону (меняются они динамически), то соответственно убираю класс. Как-то так. Надеюсь понятно растолковываю. 17 июн 2020 в 13:33
  • 2
    div.style.display = span < 1 ? 'none' : 'block';
    – user176262
    17 июн 2020 в 13:37

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.