Как скрывать нужный div и выводить другой в зависимости от цифры? на Jquery?

Question

[Gera11]

К примеру у меня есть цифра в span
<span id="cifra">42</span>
И есть div с текстом
<div class="text"> тут мой текст </div>
И иногда значение в теге span меняется на 0.
Как сделать так чтобы при значении 0 div с текстом скрывался и вместо него появлялся другой div с другим текстом?

Answer 1

[Oleg]

Можно как-то так

const cifra = document.getElementById('cifra');
cifra.addEventListener('DOMSubtreeModified', cifraChanged);

function cifraChanged(e) {
    if (cifra.innerText === '0') {
        const textElem = document.querySelector('div.text');
        textElem.style.display = 'none';
        //  А здесь делаем видимым второй блок 
    }
}

Answer 2

[Weishaypt]

Попробуйте так

<input plachelolder="Значение для span">

<span id="cifra">42</span>
<div class="text" id="div1"> тут мой текст </div>
<div id="div2" style="display: none"> Другой блок</div>

$('#cifra').on('DOMSubtreeModified', (e) => {
    if($('#cifra').text() == '0')
    {
        $('#div1').hide();
        $('#div2').show();
    }
    else
    {
        $('#div1').show();
        $('#div2').hide();
    }
})

$('input').on('keyup change', e => {
    $('#cifra').text($('input').val())
})