Comment ajouter de la classe parente en javascript?

Pas jQuery que je voudrais simplement faire $("this").parent().addClass("active"); mais dans la pure javascript. C'est parce que je ne veux pas mélanger Javascript et jQuery sur le code suivant:

var clickedPath = this.getElement(); 
clickedPath.classList.add("active"); 
var classes = clickedPath.getAttribute('class').match(/\d+/g) || []; 
buttons.forEach(function(btn) { 
    var method = classes.indexOf(btn.getAttribute('data-date')) > -1 ? 'add' : 'remove'; 
    btn.classList[method]('active');
    //btn.parent().addClass("active");
});

Mise à JOUR

C'est le HTML cas de départ avant que les classes sont ajoutés:

<ul>
  <li>1500</li>
  <li>1400
      <ul>
        <li>1401</li>
      </ul>
  </li>
</ul>

Nous avons 2 situations:

  • 1500 est unique et ne pas avoir un enfant
  • 1400 a un enfant 1401

Si je suis l'ajout de la classe active à 1500, c'est très bien et je peux utiliser le code fourni dans la réponse:

btn.parentNode.classList[method]('active');

Mais Si j'ajoute de la classe à 1401, également 1400 devrait l'être, si les éléments suivants sont les deux cas:

<ul>
  <li class="active">1500</li>
  <li>1400
      <ul>
        <li>1401</li>
      </ul>
  </li>
</ul>

Ou

<ul>
  <li>1500</li>
  <li class="active">1400
      <ul>
        <li class="active">1401</li>
      </ul>
  </li>
</ul>
  • vous être à la recherche pour btn.parentNode au lieu de btn.parent() si je suis la lecture de votre code de droit.
InformationsquelleAutor rob.m | 2016-11-19
  1. 10

    Vous parlez de "je ne veux pas mélanger js et jQuery sur le code suivant" mais vous êtes en fait le mélange de vanille DOM Api avec les méthodes jQuery. .parent et .addClass sont des fonctions jQuery. Vous pouvez code:

    btn.parentNode.classList.add("active");
    • Vous êtes les bienvenus!
    • cela la classe à tous les parents tho
    • .parentNode renvoie juste un élément du DOM.
    • je veux montrer à vous, comment pouvons-nous aller pour le chat?
    • Laissez-nous continuer cette discussion dans le chat.
    InformationsquelleAutor undefined
  2. 2

    Également envisager de parentElement comme une alternative à parentNode:

    btn.parentElement.classList.add("active");
    InformationsquelleAutor Bardy
  3. 1

    Vous avez besoin .parentNode sur l'élément.

    Quelque chose comme ça.

    var clickedPath = this.getElement();
clickedPath.classList.add("active");
var classes = clickedPath.getAttribute('class').match(/\d+/g) || [];
buttons.forEach(function(btn) {
  var method = classes.indexOf(btn.getAttribute('data-date')) > -1 ? 'add' : 'remove';
  btn.classList[method]('active');
  btn.parentNode.classList.add("active");
});
    InformationsquelleAutor Sreekanth