comment obtenir la balise précédente H3

Question

i ont ce code:

<nav role="nav" id="primary-nav" class="overview"> 
    <h3 class="section active"> 
     <span class="menu-toggle open"></span> 
     <span data-content="the-basics">The Basics</span> 
    </h3> 
     <ul class="active"> 
      <li><a href="#" class="nav-link" data-content="0">Introduction</a></li> 
      <li><a href="#" class="nav-link" data-content="1">A Chapter in the Zeitgeist Movement</a></li> 
     </ul> 
    <h3 class="section"> 
     <span class="menu-toggle"></span> 
     <span data-content="setting-up-a-national-chapter">Setting up a National Chapter</span> 
    </h3> 
    <ul> 
     <li><a href="#" class="nav-link" data-content="0">Gathering Volunteers &amp; Social Media</a></li> 
    </ul> 
</nav> 

et ce code javascript

// Load page 
    $('a.nav-link').on('click', function(event) { 
     event.preventDefault(); 
     var $this = $(this); 
     var parent = this.parentNode; 
     console.log(parent); 
     var dataContent = $this.attr("data-content"); 
     console.log(dataContent); 
    }); 

quelle est la bonne façon d'obtenir les données-content = "" du parent H3 span pour cette section spécifique, par exemple je veux retourner le "the-basics" dans le The Basics

tout conseil très apprécié.

Answer 1

var dataContent = $this.closest('ul').prev('h3').find('span[data-content]').data('content'); // the-basics 

Answer 2

Dans votre exemple donné, cela marcherait probablement, mais il pourrait être un peu fragile aux changements de modèle:

$this.closest('ul').prev('h3').children('[data-content]')