Supprimer des textes contenant un préfixe

Version imprimable

20/05/2021, 17h18
Muzan93

1 pièce(s) jointe(s)

Supprimer des textes contenant un préfixe

Bonjour à tous !

Je tiens à dire avant tout que je suis novice en JavaScript :D.
Je vous explique mon problème. En faite j'aurai besoin pour un projet depuis Foxit PhantomPDF à l'aide de l'exécution d'un script JavaScript.
De supprimer dans un tableau déjà exporté sur Foxit tous les textes contenant un préfixe par exemple "Yy". Donc si j'ai un texte au nom de "YyVoiture1" ou "YyMagasin" je voudrai qu'il soit supprimer.

Voici un exemple du tableau :
Pièce jointe 598263

Du coup je voudrais supprimer pour cet exemple tous les textes contenant le préfixe "Yy" donc "Yypeugeot", "Yycitroen" et "Yyrenault".
Franchement, je n'ai pas trop d'idée j'ai cherché un peu partout sur le net et je n'ai rien trouvé.

Toute aide serait la bienvenue !

Je vous remercie d'avance pour ceux qui s'y intéresseront.
Et bonne journée à tous les lecteurs de mon topic :)
20/05/2021, 17h43
NoSmoking
Bonjour,

Citation:

Je tiens à dire avant tout que je suis novice en JavaScript :D.

Oui mais il ne faut pas que cela devienne une fatalité !

Citation:

Franchement, je n'ai pas trop d'idée j'ai cherché un peu partout sur le net et je n'ai rien trouvé.

Il est des fois plus profitable de chercher la méthodologie plutôt qu'une solution toute faite !

Il nous manque des précisions comme où ce trouvent les données, dans une <table>, si oui alors
- il te faut parcourir les cellules de celle-ci ;
- lire le contenu de la cellule et vérifier si celui-ci commence par Yy et si oui le supprimer.
dans un premier temps, est-ce que cela te parle ?
20/05/2021, 17h55
Muzan93

Bonjour d’abord merci pour ta réponse.
Oui les données sont bien contenues dans des cellules d’un tableau qui a été créé sur Word puis exporté ensuite sur Foxit.

Et non je n’ai pas d’idée j’ai compris ce qu’il faut faire mais comment le faire pas du tout c’est mon premier code en JS mais ce n’est pas une excuse c’est juste pour me situer dans mon expérience
Mais je vais me renseigner :)
21/05/2021, 07h54
NoSmoking

Il me semblait bien que l'on avait traité un cas similaire il y a peu !

Tu peux donc te rapprocher d'une discussion récente et de la réponse faite au post #8, la démarche est sensiblement la même à l'exception qu'il te faut lire éventuellement la(es) cellule(s), voir post #10.

Pour tester si la chaîne comme par « Yy » il existe une méthode de l'objet String nommée : startsWith().
21/05/2021, 09h42
Eckmül

D'après moi, une fois les cellules parcourus, il faut surement comparer les deux premiers caractères si tes préfixes sont forcément au début et de 2 caractères, cela devrait pouvoir régler le problème.
21/05/2021, 09h56
Muzan93

Citation:

Envoyé par NoSmoking

Il me semblait bien que l'on avait traité un cas similaire il y a peu !

Tu peux donc te rapprocher d'une discussion récente et de la réponse faite au post #8, la démarche est sensiblement la même à l'exception qu'il te faut lire éventuellement la(es) cellule(s), voir post #10.

Pour tester si la chaîne comme par « Yy » il existe une méthode de l'objet String nommée : startsWith().

Merci beaucoup NoSmoking !
Je vais tout de suite m'intéresser sur la discussion que tu m'as envoyé.
Et je sais pas si c'est ce que tu me disais de faire mais je voudrais lire l'intégralité des cellules du tableau et non des cellules spécifiques. Et pour la méthode de l'objet String : startsWith(), je vais regarder comment je pourrais l'utiliser :)
21/05/2021, 10h00
Muzan93

Citation:

Envoyé par Eckmül

D'après moi, une fois les cellules parcourus, il faut surement comparer les deux premiers caractères si tes préfixes sont forcément au début et de 2 caractères, cela devrait pouvoir régler le problème.

Merci beaucoup pour ta réponse Eckmül !

Je me demandais si c'était possible de parcourir directement toutes les cellules du tableau sans parcourir forcément une cellule spécifique ?
Et après comme tu l'as dit je compare dans toutes les cellules les deux premiers caractères et si ces deux caractères sont égales à "Yy" je supprime le mot complet.

Citation:

Envoyé par Muzan93

Je me demandais si c'était possible de parcourir directement toutes les cellules du tableau sans parcourir forcément une cellule spécifique ?

Attention à la compréhension du code.
Dans l'exemple du post #10 le code suivant :

Code:

const text = tr.cells[0].textContent; // lecture du contenu de la 1st cellule

est à mettre, en remplacement, dans le code du post #8, dans ce cas seule la 1st cellules de toutes les lignes sont parcourues.

Citation:

Envoyé par Muzan93

Et je sais pas si c'est ce que tu me disais de faire mais je voudrais lire l'intégralité des cellules du tableau et non des cellules spécifiques.

il te suffit dans ce cas pour chaque lignes lire toutes les cellules de celle-ci, il existe la collection cells pour chaque rows mais il existe des façons de faire plus directes, en voilà une :
Code:

1 2 3 4 5 6 7 8 9 10 // récup. de toutes les <td> const oCells = document.querySelectorAll("table td"); const search = "Yy"; // la boucle de recherche for (let cell of oCells) { const text = cell.textContent; // lecture du contenu brut if (text.startsWith(search)) { // occurrence trouvée cell.textContent = "...!!"; // on remplace le contenu par ce que l'on veut ou par rien } }
je précise bien que c'est une façon de faire parmi bien d'autres !

21/05/2021, 12h00
Muzan93

Merci encore pour ta réponse NoSmoking :)
Juste je pourrai savoir à quoi sert la première ligne du code car je n'ai pas compris, elle sert à appliquer l'action sur l'ensemble des tableaux ?
Si oui, pourquoi alors tu as mis "table td" ? Désolé j'essaie de comprendre sur ce point.

Sinon j'ai compris l'intégralité du code, je voulais le tester pour voir si cela fonctionnait mais cela me met des erreurs concernant la première ligne.

https://zupimages.net/up/21/20/famg.png
21/05/2021, 18h10
NoSmoking

Citation:

Juste je pourrai savoir à quoi sert la première ligne du code car je n'ai pas compris, elle sert à appliquer l'action sur l'ensemble des tableaux ?

elle sert à récupérer toutes les cellules, <td> qui sont présentent dans ta page au moment de l'appel.
Cela aurait pu être écrit plus simplement encore :

Code:

const oCells = document.querySelectorAll("td");

Voir : Document.querySelectorAll() et pas que d'ailleurs ;)

Citation:

... mais cela me met des erreurs concernant la première ligne.

Comment testes tu, directement dans la console, dans ce cas il te faut recharger la page après chaque modification à cause des déclarations de variables avec const et let.

Une autre solution est de supprimer, juste pour tes tests, les const du code.

Le mieux restant à mon sens la réalisation d'un fichier autonome de test.
21/05/2021, 18h22
Muzan93

Citation:

Envoyé par NoSmoking

elle sert à récupérer toutes les cellules, <td> qui sont présentent dans ta page au moment de l'appel.
Cela aurait pu être écrit plus simplement encore :
Code :

Code:

const oCells = document.querySelectorAll("td");

Ah d'accord, je comprends mieux l'utilité merci :)

Citation:

Envoyé par NoSmoking

Comment testes tu, directement dans la console, dans ce cas il te faut recharger la page après chaque modification à cause des déclarations de variables avec const et let.

Oui c'est exactement ça j'exécute le code directement dans la console pour tester, mais si le code est fonctionnel je peux l'enregistrer dans le document et l'utiliser à tout moment mais pour l'instant je préfère le tester depuis la console.

Citation:

Envoyé par NoSmoking

Une autre solution est de supprimer, juste pour tes tests, les const du code.

Ok merci je vais tester ça dans ce cas :D

Citation:

Envoyé par NoSmoking

Le mieux restant à mon sens la réalisation d'un fichier autonome de test.

Que veux-tu dire par cela ?
21/05/2021, 18h53
Muzan93

Citation:

Envoyé par NoSmoking

Une autre solution est de supprimer, juste pour tes tests, les const du code.

MAJ : j'ai supprimé tous les const du code et maintenant j'ai une autre erreur.

https://zupimages.net/up/21/20/m5q5.png

Je vois pas d'où vient cette erreur :?

Si tu as ce message d'erreur c'est que tu testes hors contexte d'une page web.
Concernant un fichier de test, cela signifie que tu crées un document reprenant ta problématique avec des données et ta fonction à tester que tu pourras modifier.

Cela pourrait ressembler à cela :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Fichier de test cellules</title>
<!-- un minimum de style -->
<style>
body {margin: 1em;font: 1em/1.5 Verdana,sans-serif;}
th, td {padding: 1em;min-width: 6em;border: 1px solid #CCC;}
td:empty {background: #FDE;}
 </style>
</head>
<body>
<h1>Fichier de test cellules</h1>
<p><button onclick="fctTest()">Tester</button>
<!-- ici les données à traiter -->
<table>
  <thead>
    <tr>
      <th>Marque</th>
      <th>Col #1</th>
      <th>Col #2</th>
      <th>Col #3</th>
      <th>Col #4</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Citroën</td>
      <td>yyCitroën</td>
      <td>YYCitroën</td>
      <td>YyCitroën</td>
      <td>yYCitroën</td>
    </tr>
    <tr>
      <td>Peugeot</td>
      <td>YyPeugeot</td>
      <td>yYPeugeot</td>
      <td>YYPeugeot</td>
      <td>yyPeugeot</td>
    </tr>
    <tr>
      <td>Renault</td>
      <td>YYRenault</td>
      <td>YyRenault</td>
      <td>yyRenault</td>
      <td>yYRenault</td>
    </tr>
  </tbody>
</table>
<!-- ici le code à tester -->
<script>
function fctTest(){
  // récup. de toutes les <td>
  const oCells = document.querySelectorAll("td");
  const search = "Yy";
  // la boucle de recherche
  for (let cell of oCells) {
    const text = cell.textContent;      // lecture du contenu brut
    if (text.startsWith(search)) {      // occurrence trouvée
      cell.textContent = "";            // on remplace le contenu par ce que l'on veut ou par rien
    }
  }
}
</script>
</body>
</html>

Il te suffit de mettre des données les plus judicieuses possibles pour tester les différents cas.
C'est simple et efficace :)