Je suis, je pense un peu perdu, comme hier sur la même fonction, je reste bloqué. L'écoute des articles fonctionne comme voulus, mais j'ai un souci sur mon ul qui ne semble pas englobé la liste li comme souhaiter.
Je pense que tu ne t'y prends pas de la mnière la plus optimale, tu codes du JS comme du PHP.
Le fait d'utiliser un langage côté client nous permet de manipuler les éléments du DOM avec des fonctions dédiées. C'est à dire que tu n'es pas obligé de concaténer tout ton html. Je te recommande par exemple de regarder du côté de createElement et append. Je t'ai fais un petit codePen en espérant qu'il soit assez clair.
Tu peux voir que derrière la propriété 'innerHTML' tu as un setter (donc une function) qui effectue un traitement à la string que tu associes à cette propriété.
Ce traitement, dans le cas d''innerHTML' consiste notamment à corriger et parser la string sous forme de HTML.
Car le navigateur aura repérer l'ouverture de ta balise 'ul' sans qu'elle soit fermé, et lui pas con qu'il est, va se dire qu'il est nécessaire de la refermer pour que ça soit correcte. Il ne va pas attendre ta ligne suivante qui fermera plus tard la balise.
Il va se dire que ta jamais ouvert de balise 'ul' ou 'article' et que ta dû faire une erreur en voulant fermer ces balises (qui donc, d'après lui, n'ont jamais été ouverte).
La solution est de passer par une variable qui contiendra ta string complète et d'associer cette string à 'innerHTML' :
Je pense que tu ne t'y prends pas de la mnière la plus optimale, tu codes du JS comme du PHP.
Alors oui, depuis que j'ai commencé le js, c'est mon grand souci... Comme j'ai commencé par le PHP, j'ai du mal ne pas mélanger.
Je vais tester vos idées, merci pour les explications. J'espère pouvoir par la suite manipuler la class des li afin de les afficher ou caché en fonction d'un clic.
Développeur react freelance à Toulouse
Je suis développeur react freelance spécialisé dans la création de site internet basé à Toulouse