Reputation: 1
please tell me how to do in this function so that the value having 0 is not displayed
const elements = document.querySelectorAll('.age-count')
elements.forEach(function(el) {
const count = el.textContent
const title = declination(count, [' год', ' года', ' лет'])
const age = count + title
el.textContent = age
})
function declination(number, titles) {
cases = [2, 0, 1, 1, 1, 2];
return titles[(number % 100 > 4 && number % 100 < 20) ? 2 : cases[(number % 10 < 5) ? number % 10 : 5]];
}
<div class="age-count">22</div>
<div class="age-count">0</div>
Upvotes: 0
Views: 47
Reputation: 337560
To hide the element check that it's text is equal to 0
, and if so set it to display: none
.
const elements = document.querySelectorAll('.age-count')
elements.forEach(function(el) {
const count = el.textContent
if (+count === 0)
el.style.display = 'none';
const title = declination(count, [' год', ' года', ' лет'])
const age = count + title
el.textContent = age
})
function declination(number, titles) {
cases = [2, 0, 1, 1, 1, 2];
return titles[(number % 100 > 4 && number % 100 < 20) ? 2 : cases[(number % 10 < 5) ? number % 10 : 5]];
}
<div class="age-count">22</div>
<div class="age-count">0</div>
Note that this still follows the logic to update the text within the element, even though it has been hidden. You can easily amend the logic flow to avoid that, though.
Upvotes: 1