Utiliser JQuery pour déclencher un événement de clic uniquement lorsqu'un caractère spécifique apparaît dans un paragraphe

Question

J'ai un accordéon avec un texte marqué "Important". Je souhaite que la page ouvre automatiquement les pages marquées « Important » en cliquant sur un bouton bascule lors du chargement de la page.

J'ai utilisé $(".diff__filename:contains('sections/')")) pour rechercher le mot « Important » dans le titre, mais je ne sais pas comment lui dire de cliquer sur le bouton à côté.

J'ai choisi d'utiliser JQuery pour éviter de parcourir les noms de classes.

<p class="title">
  Important: Content 1
  <button class="toggle">Open</button>
</p>
<p class="title">
  Content 2
  <button class="toggle">Open</button>
</p>
<p class="title">
  Content 3
  <button class="toggle">Open</button>
</p>
<p class="title">
  Important: Content 4
  <button class="toggle">Open</button>
</p>

Answer 1

Vous pouvez utiliser :contains sur un élément puis déclencher un clic :

$('document').ready(function() {

  $('button').click(function() {
    let name = $(this).data('name');
    console.log('click on:', name);
  });

  $('div p:contains("Important")').find('button').trigger('click');

});

sssccc


  Important: Content 1
  Open


  Content 2
  Open


  Content 3
  Open


  Important: Content 4
  Open

Charger la sortie :

click on: Button 1
click on: Button 4