La déclaration ternaire ne fonctionne pas

Question

1.  document.getElementById('navButton').addEventListener('click', toggleNav);
2.  document.getElementById('menuButton').addEventListener('click', toggleMenu);
3.  function toggleNav(){
4.    document.getElementById('nav').className == 'open' ? 'closed' : 'open';
5.    document.getElementById('navButton').className == 'open' ? 'closed' : 'open';
6.  }
7.  function toggleMenu(){
8.    document.getElementById('menu').className == 'open' ? 'closed' : 'open';
9.    document.getElementById('menuButton').className == 'open' ? 'closed' : 'open';
10. }

Dans le code ci-dessus, j'obtiens ce message d'erreur à côté des lignes 4, 5, 8 et 9 :

"Je m'attendais à une affectation ou à un appel de fonction et j'ai vu une expression à la place."

Je n'ai jamais eu ce problème avant, et si je change juste document.getElementById('nav').className == 'open' ? 'closed' : 'open'; à document.getElementById('nav').className = 'open'; Il fonctionne très bien. Qu'est-ce que je fais de travers ?

Answer 1

Vous n'assignez pas la valeur de retour ternaire à quoi que ce soit. Vous devez faire quelque chose comme ça :

document.getElementById('nav').className = document.getElementById('nav').className == 'open' ? 'closed' : 'open';

Voici un exemple tiré de MDN qui est plus facile à digérer :

var elvisLives = Math.PI > 4 ? "Yep" : "Nope";
    ^^^^^^^^^^   ^^^^^^^^^^^   ^^^^^   ^^^^^^^
//  assignment    condition    expr1    expr2