Bonjour,
Je voulais savoir si en JS, il était possible de cherche un mot dans un page html et de remplacer ce mot par un autre mot ou par exemple le mettre en gras ?
Thais
Bonjour,
Je voulais savoir si en JS, il était possible de cherche un mot dans un page html et de remplacer ce mot par un autre mot ou par exemple le mettre en gras ?
Thais
A priori oui.
En faisant une recherche sur document.body.innerHTML.
oui et non
effectivement yahiko à raison innerHTML contient bien le code source de la page
un appel à replace remplacera le mot
mais en fait il va aussi changer toute la page.
modifier le innerHTML d'un élément revient à supprimer son contenu et le remplacer par le DOM correspondants au code HTML fourni.
si donc des valeurs ont changés (variable js) après le replace la page sera comme à l'origine (les modifs seront perdues)
mais il est possible de chercher tous les textNodes et de remplacer le texte dans ceux-ci
c'est long mais pas compliqué.
il est grandement préférable de mettre un id sur l'élément modifiable et de ne sélectionner que selui-ci lors du remplacement
A+JYT
Il est effectivement préférable de préciser un sous-conteneur contenant le texte à remplacer pour des raisons évidentes de performance et de prévention de problèmes. Par contre un ID n'est pas forcément le plus approprié, attention avec les mauvais réflexes.
Un exemple :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11 var node; var walker = document.createTreeWalker( elementSousConteneur, NodeFilter.SHOW_TEXT, null, false ); while(node = walker.nextNode()) { node.textContent = node.textContent.replace("mot-a-remplacer", "remplacement"); }
je pense tout de même que si on n'a à modifier qu'un seul élément
est plus efficace.
Code : Sélectionner tout - Visualiser dans une fenêtre à part document.getElementById("myId").innerText.replace("mot-a-remplacer", "remplacement");
je maintiens que l'ID est une bonne pratique. même si très souvent je dis qu'on peut efficacement s'en passer.
A+JYT
L'ID n'est pas une bonne pratique, pas plus que ne l'est la classe, le tagName ou toute autre forme de sélection. La bonne pratique, c'est de choisir le plus approprié selon la situation. Et au vu du nombre de gens qui ne connaissent rien d'autre que document.getElementById, il me paraît important de mentionner les autres options.
Et pour info, innerText n'est pas standard. C'est textContent qu'il faut utiliser.
Vous avez un bloqueur de publicités installé.
Le Club Developpez.com n'affiche que des publicités IT, discrètes et non intrusives.
Afin que nous puissions continuer à vous fournir gratuitement du contenu de qualité, merci de nous soutenir en désactivant votre bloqueur de publicités sur Developpez.com.
Partager